My (Un)Modal Popup

I have added a modal popup to my user control. I show the modal popup by registering a startup script in the code-behind of an update panel trigger. The modal popup appears, but it isn't modal. I can click and edit the form fields behind the modal popup. Has anyone seen this happen? Any thoughts on how to fix it?Post code and I might be able to help you

Have you set the BackgroundCSSClass properly? I saw the same behavior and was able to fix it by setting the BackgroundCSS... here's an example of the CSS I used

.modalBackground

{background-color:Gray;filter:alpha(opacity=70);

}

I used below css but still my main page controls can be accessed?

.modalBackground

{background-color:Gray;filter:alpha(opacity=70);

}

This is happening in (Un)Modal fashion, any have solution for this.

My Calendar (AJAX asp.net) get NUTS? Only shows 5 days, instead of 7 days

Hi,

the problem is that my calendar shows only 5 days instead of 7 days. Any IDEAS? There is no (code-behind) code in CS file that does hide weekend.

here is a code

<asp:TextBox runat="server" ID="TBsearchFrom" Columns="10" />
<asp:TextBox runat="server" ID="TBsearchTo" Columns="10" />
<ajaxToolkit:CalendarExtender ID="cldFrom" runat="server"
TargetControlID="TBsearchFrom"
CssClass="MyCalendar"
Format="MM/dd/yy"
OnClientDateSelectionChanged = "function(e){calendar_hide(e);}"
FirstDayOfWeek="Monday"

/>
<ajaxToolkit:CalendarExtender ID="cldTo" runat="server"
TargetControlID="TBsearchTo"
CssClass="MyCalendar"
Format="MM/dd/yy"
OnClientDateSelectionChanged = "function(e){calendar_hide(e);}"
FirstDayOfWeek="Monday"
/>
<br/>

I had this same issue. The problem was that the calendar was picking up on CSS set for my site, which didn't have the right padding for each of the calendar's components. What I did was copy the calendar's padding properties in the CSS from the example in the toolkit and paste it into my CSS file, and customized the colors from there.

Hi there,

I am having the same kind of problem, my calendar control is contained within a detailsview. I have added the css to look like this

.MyCalendar.ajax__calendar_container {

border:1pxsolid#646464;

background-color:#ffffff;

color:#000000;

}

.MyCalendar

.ajax__calendar_footer {border-top:1pxsolid#f5f5f5;

}

.MyCalendar

.ajax__calendar_dayname {border-bottom:1pxsolid#f5f5f5;

}

.MyCalendar

.ajax__calendar_day {border:1pxsolid#ffffff;

}

.MyCalendar

.ajax__calendar_month {border:1pxsolid#ffffff;

}

.MyCalendar

.ajax__calendar_year {border:1pxsolid#ffffff;

}

.MyCalendar

.ajax__calendar_active.ajax__calendar_day {background-color:#edf9ff;border-color:#0066cc;color:#0066cc;

}

.MyCalendar

.ajax__calendar_active.ajax__calendar_month {background-color:#edf9ff;border-color:#0066cc;color:#0066cc;

}

.MyCalendar

.ajax__calendar_active.ajax__calendar_year {background-color:#edf9ff;border-color:#0066cc;color:#0066cc;

}

.MyCalendar

.ajax__calendar_other.ajax__calendar_day {background-color:#ffffff;border-color:#ffffff;color:#646464;

}

.MyCalendar

.ajax__calendar_other.ajax__calendar_year {background-color:#ffffff;border-color:#ffffff;color:#646464;

}

.MyCalendar

.ajax__calendar_hover.ajax__calendar_day {background-color:#edf9ff;border-color:#daf2fc;color:#0066cc;

}

.MyCalendar

.ajax__calendar_hover.ajax__calendar_month {background-color:#edf9ff;border-color:#daf2fc;color:#0066cc;

}

.MyCalendar

.ajax__calendar_hover.ajax__calendar_year {background-color:#edf9ff;border-color:#daf2fc;color:#0066cc;

}

.MyCalendar

.ajax__calendar_hover.ajax__calendar_title {color:#0066cc;

}

.MyCalendar

.ajax__calendar_hover.ajax__calendar_today {color:#0066cc;

}

But whenever I open the calender I am only presented with 8 days of the month (the 1st 4 and last 4) I think its a padding issue but I dont know what else to change

Never mind my last post.

But if anyone is having the same problem all you need to do is add some extra css for the body of the calendar.

In my case I had mine within a td

.MyCalendar

td

{

padding:0px,0px,0px,0px;border-spacing:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;

}