I have a code in my project to open a calendar in child window on click of a link in home page. The calendar has 2 drop downs (for month and year). The calendar drop down is working fine in all browser except IE9.
In IE9 the drop down is not getting displayed. On click of arrow button of drop down nothing is happening. I am debugging the javascript in browser , I tried to add few new style to the <select> tag in debugging tool only, e.g height : 50px then the drop down came but, If I am adding the same property in code then it is not working......Cleared the browser cache then verified but still the style changed through code is not reflecting at all.
The code to print calendar is in javascript as follows :
// html generation (feel free to tune it for your particular application)
// print calendar header
var str_buffer = new String (
"<html>\n"+
"<head>\n"+
" <title>"+calendarText+"</title>\n"+
"<link rel=stylesheet type=\"text/css\" href=\"/GPS/theme/style_gps_guide_ie.css\">"+
"</head>\n"+
"<body bgcolor=\"#4682B4\">\n"+
"<table class=\"clsOTable\" cellspacing=\"0\" border=\"0\" width=\"210\">\n"+
"<tr><td bgcolor=\"#4682B4\">\n"+
"<table STYLE=\"table-layout:fixed\" cellspacing=\"1\" cellpadding=\"3\" border=\"0\" width=\"100%\">\n"+
"<tr>\n"+
"<td colspan=7 width=210 height=130 align=center>\n");
str_buffer+=
"<select ID=\"dropmonth\" class=\"blueText\" style=\"font-family:Verdana, Geneva, Arial, "+
"Helvetica, sans-serif;font-size:10px;height:52px;display:inline-block;"+
"background-color:#DBEAF5;color:black;width:100\" "+
"onchange=\"window.opener.rollCalendar(dropmonth,dropyear,"+
"'"+str_target+"','"+ dt2dtstr4(dt_datetime)+"')\">\n";
for(z=0;z<monthNames.length-1;z++) {
str_buffer+=
"<OPTION value=\""+(z)+"\"";
if(z == dt_datetime.getMonth())
str_buffer+=" SELECTED";
str_buffer+=">"+monthNames[z+1]+"</OPTION>\n";
}
str_buffer+=
"</SELECT>\n"+
"<SELECT ID=\"dropyear\" style=\"font-family:Verdana, Geneva, Arial, "+
"Helvetica, sans-serif;font-size:10px;line-height:12px;"+
"background-color:#DBEAF5;color:black;width:60\""+
"onchange=\"window.opener.rollCalendar(dropmonth,dropyear,"+
"'"+str_target+"','"+ dt2dtstr4(dt_datetime)+"')\">\n";
for(z=1950;z<2051;z++) {
str_buffer+=
"<OPTION value=\""+z+"\" ";
if(dt_datetime.getYear() >1999){
if(z == dt_datetime.getYear())
str_buffer+=" SELECTED";
str_buffer+=">"+z+"</OPTION>\n";
}else{
if(z == "19" + dt_datetime.getYear())
str_buffer+=" SELECTED";
str_buffer+=">"+z+"</OPTION>\n";
}
}
str_buffer+=
"</SELECT>\n"+
"</td>\n</tr>\n";
// print calendar footer
str_buffer +=
"</table>\n" +
"</tr>\n</td>\n</table>\n" +
"</body>\n" +
"</html>\n";
I am totally exhausted... not getting any solution that why in IE9 drop down is not working and why the new style attribute is not showing its effect...
Please help... I really need help to solve this issue......
Thanks in advance..