Change the <div> that contains the Calendar into a Panel.
When the month is changed set the style of the panel to display:block.
You'll have to change your JavaScript so that it uses the Panel's ClientID. Sometimes when the Panel is rendered in the browser (as a <div>) it's given a different ID than the one you gave it in your .NET code. The reason is because the ID has to be unique....so if you're using MasterPages or User Controls this is changed in order to meet this requirement.
Please note that I'm using VB.NET in the following example...let me know if you're using C#...
-
<img src="Calendar.gif" onclick="displayCalendar()" />
-
-
<asp:Panel Id="datePicker" runat="server">
-
<asp:Calendar
-
id="calEventDate"
-
OnSelectionChanged="calEventDate_SelectionChanged"
-
Runat="server" />
-
</asp:Panel>
-
-
function displayCalendar()
-
{
-
var datePicker = document.getElementById('<%= datePicker.ClientID %>');
-
datePicker.style.display = 'block';
-
}
-
In your .net code you'd have:
-
Private displayCalEventDate As Boolean = False 'indicates whether or not to display the panel containng the calendar on postback
-
-
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
-
-
If IsPostBack = True Then
-
'Retrieving whether or not to display the panel containing the calanedar
-
'from ViewState... it's saved there in the PreRender event.
-
displayCalEventDate = Ctype(ViewState("displayCalEventDate"), Boolean)
-
End If
-
-
End Sub
-
-
Protected Sub calEventDate_SelectionChanged(ByVal sender As Object, ByVal e As EventArgs) Handles calEventDate.SelectionChanged
-
displayCalEventDate = True
-
End Sub
-
-
Private Sub Page_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender
-
'The PreRender event happens just before the page is sent to the browser
-
'Here Check to see if the calendar's style should be changed to display
-
'And save the value for next time (I'm using ViewState here but you don't have to)
-
-
ViewState("displayCalEventDate") = displayCalEventDate
-
If displayCalEventDate Then
-
datePicker.style.Remove("display")
-
datePicker.style.Add("display", "block")
-
End If
-
End Sub
Cheers!
-Frinny