title: Showing Calendar Using JavaScript Function
body: <p>I want to make a calendar that display itself on clicking to the calendar image, and whenever a date is selected, it is shown in the textbox. I have done this part but the problem is whenever I change the month of the calendar, the page refreshes itself and the calendar display becomes none again while on clicking the calendar image again, the calendar displays the next month. I want to change the month of the calendar without making the page refresh.</p>
  
  <p>I am making it in Visual Studio. I search for the query on the site but almost all answers uses PHP(which I don't understand).</p>
  
  <p>Code:</p>
  
  <pre><code>&lt;asp:TextBox ID="txtCal" runat="server"&gt;&lt;/asp:TextBox&gt; &lt;img alt="" src="CalendarImage.jpg" width="20px" height="20px" onclick="show()" /&gt; &lt;/br&gt;
  &lt;div id="cal"&gt;
  &lt;asp:Calendar ID="Calendar1" runat="server" onselectionchanged="Calendar1_SelectionChanged"&gt;&lt;/asp:Calendar&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>OnChangingSelectedDate</p>
  
  <pre><code>protected void Calendar1_SelectionChanged(object sender, EventArgs e)
      {
          txtCal.Text = Calendar1.SelectedDate.ToString("dd/MM/yyyy");
      }
  </code></pre>
  
  <p>StyleSheet:</p>
  
  <pre><code>#cal
          {
              display: none; 
          }
  </code></pre>
  
  <p>JavaScript Function:</p>
  
  <pre><code>function show() {
      document.getElementById("cal").style.display = "block";
  }
  </code></pre>