Home > ASP.Net, Javascript > Popup Calender in DIV

Popup Calender in DIV


Hi

try this example :-

<div id="dateField" style="display:none;">
  <asp:Calendar id="calDate"
  OnSelectionChanged="calDate_SelectionChanged"
  Runat="server" />
</div>

<asp:TextBox
  id="txtDate"
  Runat="server" />
<img src="cal.png" onclick="popupCalendar()" />

<script type="text/javascript">
  function popupCalendar()
  {
    var dateField = document.getElementById('dateField');
   
    // toggle the div
    if (dateField.style.display == 'none')
        dateField.style.display = 'block';
    else
        dateField.style.display = 'none';
  }
</script>

in code behind ;-

protected void calDate_SelectionChanged(object sender, EventArgs e)
{
  txtDate.Text = calDate.SelectedDate.ToString("d");
}

Hope this helps

Good Luck

Advertisements
Categories: ASP.Net, Javascript
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: