2013-11-21 128 views
0

我想使用j查詢日期選擇器只顯示月份和年份,但我的問題是日期選擇器彈出或僅適用於如果我第一次單擊包含日期選擇器的文本框,但是如果我先單擊其他文本框;然後我嘗試點擊日期選擇器文本框它不起作用。我在這裏做錯了什麼?這裏是我的代碼:使用j查詢日期選擇器只顯示月份和年份

<asp:TemplateField HeaderText="Select Facility:"> 
        <ItemTemplate> 
         <asp:Label ID="lblFacilityType" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.Facility") %>'></asp:Label> 
        </ItemTemplate> 
        <EditItemTemplate> 
         <asp:TextBox ID="txtFacilityType" runat="server" Width="180" Text='<%# DataBinder.Eval(Container, "DataItem.Facility") %>'></asp:TextBox> 
         <asp:Panel ID="Panel1_SR" runat="server" CssClass="popupControl"> 
          <asp:UpdatePanel ID="UpdatePanel1_SR" runat="server"> 
           <ContentTemplate> 
            <asp:RadioButtonList ID="RadioButtonList1_Facility" runat="server" AutoPostBack="true" 
             OnSelectedIndexChanged="FacilityType_SelectedIndexChanged" Width="140px"> 
             <asp:ListItem Text="East"></asp:ListItem> 
             <asp:ListItem Text="South"></asp:ListItem> 
            </asp:RadioButtonList> 
           </ContentTemplate> 
          </asp:UpdatePanel> 
         </asp:Panel> 
         <br /> 
         <ajaxToolkit:PopupControlExtender ID="PopupControlExtender1_SR" runat="server" CommitProperty="value" 
          PopupControlID="Panel1_SR" Position="Bottom" TargetControlID="txtFacilityType"> 
         </ajaxToolkit:PopupControlExtender> 
        </EditItemTemplate> 
       </asp:TemplateField> 
       <asp:TemplateField HeaderText="Select Month/Year:"> 
        <ItemTemplate> 
         <asp:Label ID="lblDate" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.Month_Year") %>'></asp:Label> 
        </ItemTemplate> 
        <EditItemTemplate> 
         <asp:TextBox ID="txtInputDate" runat="server" CssClass="date-picker"></asp:TextBox> 
        </EditItemTemplate> 
       </asp:TemplateField> 

,並在這裏爲日期選擇器的腳本

<script type="text/javascript"> 
     $(function() { 
      $('.date-picker').datepicker({ 
       changeMonth: true, 
       changeYear: true, 
       showButtonPanel: true, 
       dateFormat: 'MM yy', 
       onClose: function (dateText, inst) { 
        var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
        var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
        $(this).datepicker('setDate', new Date(year, month, 1)); 
       } 
      }); 
     }); 
</script> 
<style type="text/css"> 
.ui-datepicker-calendar { 
    display: none; 
    } 
</style> 

回答

0
$().ready(function() { 
      $('.date-picker').mousedown(function() { 
       $('.date-picker').datepicker({ 
        changeMonth: true, 
        changeYear: true, 
        showButtonPanel: true, 
        dateFormat: 'MM yy', 
        onClose: function (dateText, inst) { 
         var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
         var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
         $(this).datepicker('setDate', new Date(year, month, 1)); 
        } 
       }); 
      }); 
     }); 

如何改變這樣的代碼。在類別「date-picker」的文本框上按下鼠標按鈕時,應該觸發您的函數。

而且不是這一行<asp:TextBox ID="txtInputDate" runat="server" CssClass="date-picker"></asp:TextBox>添加<input name="txtInputDate" id="txtInputDate" runat="server" class="date-picker" />

+0

,謝謝,我試過了,但還在做同樣的事情。由於某種原因,它不喜歡當我點擊設施文本框第一,但日期選擇器將正常工作,如果我不點擊任何其他文本框。 – moe

+0

請參閱更新的答案,並告知是否有任何結果。 – BBekyarov

+0

它看起來不起作用後,頁面發佈包,但它只能在第一次,當發佈後組件時,它不起作用。我必須刷新頁面或點擊f5以使日期選擇器再次工作。謝謝 – moe

相關問題