Click here to Skip to main content
15,867,568 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I would like to add css style to javascript page plzzzz help me and thanks in advance

XML
document.getElementById('tdMilestoneHeader').innerHTML = '<div class="TitleCss1"><table style="width:93%;color: #1a4381;font-weight: bolder;font-family:Calibri; font-size:medium"><tr><td align="left">'+
            '<label style="font-family:Calibri;font-weight:800;font-size:19" > Show me my </label> &nbsp;&nbsp;' +
         '<select id="FilterSelection" onchange="combobox()" style="font-family:Calibri;font-weight:800;font-size:17;background-color:#B7DBFF; width:139px; ForeColor:#003399; color:#003399"> <option value="liabilities">Liabilities</option><option value="plan">Plan</option></select>&nbsp;&nbsp;&nbsp; ' +
         '<label style="font-family:Calibri;font-weight:800;font-size:19" > for </label> &nbsp;&nbsp;' +
         '<select id="PeriodSelection" onchange="combobox()" style="font-family:Calibri;font-weight:800;font-size:17;background-color:#B7DBFF; width:139px; ForeColor:#003399; color:#003399"> <option value="currentweek">Current Week</option><option value="nextweek">Next Week</option><option value="currentmonth">Current Month</option><option value="nextmonth">Next Month</option><option value="allperiods">All Period</option></select>&nbsp;&nbsp;&nbsp; ' +
         '<label id="thTotal" style="font-family:Calibri;font-weight:800;font-size:19">Total-' + BugCount + '</label>&nbsp;&nbsp;' +
         '<label id="thTotal" style="font-family:Calibri;font-weight:800;font-size:19">(' + dateheader +')</label></td></td>' +
         '<td align="right" valign="top" ><img src="../TaskManager/images/excel.png" onclick="OnExport2ExcelClick();" title="Export to excel."style="cursor: hand; height: 22px; width: 25px; vertical-align:top;" /></td></tr><table></div>';

This is my javascript page

HTML
<style>            
 .select{
             border:1px solid #ccc;
             overflow:hidden;
             background:url('../Images/h_expand.gif') no-repeat 95% 50%;
         }
        .select::-ms-expand {
             display: none;
         }
    </style>
This is the style in Html page
I would like to add this style to the select option box present in the innerhtml I couldnt place this select option in html page because it is in master page.so inserted as innerhtml. Is there any possibility to add style class?
Posted
Comments
[no name] 5-Oct-15 2:41am    
Can you please try your css without . symbol. Here is the code:

<style>
select{
border:1px solid #ccc;
overflow:hidden;
background:url('../Images/h_expand.gif') no-repeat 95% 50%;
}

select::-ms-expand {
display: none;
}
</style>

1 solution

Just add like..
HTML
<select class="select" ....
 
Share this answer
 
v2
Comments
Member 11698441 5-Oct-15 2:08am    
No i tried and its not working.
It should work. Analyze the control in browser developer tool.
Krunal Rohit 5-Oct-15 2:11am    
should be class="select"

-KR
Oops yeah Krunal. :) Thanks :)
Member 11698441 5-Oct-15 2:12am    
I placed the style in masterpage and when i call the class in javascript its not working.. Should I place the style in javascript page or in aspx page?

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900