2

カレンダー画像をクリックすると表示されるカレンダーを作成したいのですが、日付が選択されるたびにテキストボックスに表示されます。この部分は完了しましたが、カレンダーの月を変更するたびにページが更新され、カレンダーの画像をもう一度クリックするとカレンダーの表示が再び表示されなくなり、カレンダーは次の月を表示します。ページを更新せずにカレンダーの月を変更したい。

Visual Studioで作っています。サイトでクエリを検索しますが、ほとんどすべての回答が PHP を使用しています (これはわかりません)。

コード：

<asp:TextBox ID="txtCal" runat="server"></asp:TextBox> <img alt="" src="CalendarImage.jpg" width="20px" height="20px" onclick="show()" /> </br>
<div id="cal">
<asp:Calendar ID="Calendar1" runat="server" onselectionchanged="Calendar1_SelectionChanged"></asp:Calendar>
</div>

OnChangingSelectedDate

protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
        txtCal.Text = Calendar1.SelectedDate.ToString("dd/MM/yyyy");
    }

スタイルシート:

#cal
        {
            display: none; 
        }

JavaScript 関数:

function show() {
    document.getElementById("cal").style.display = "block";
}
4

1 に答える 1

1

このJavaスクリプトを使用してください 

<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>

そしてテキストボックス：

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

および div タグのカレンダー:

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

およびコードビハインドで：

     protected void calDate_SelectionChanged(object sender, EventArgs e)
{
    txtDate.Text = calDate.SelectedDate.ToString("d");
}
 protected void calDate_VisibleMonthChanged(object sender, MonthChangedEventArgs e)
{
  ClientScript.RegisterStartupScript(this.GetType(), "myScript", "<script language=JavaScript>popupCalendar();</script>");
}
于 2013-06-24T13:30:25.333 に答える