JQuery UI內聯DatePicker在ASP.NET回發後失去選定的日期，如何保留它？

我有一個jQuery的日期選擇器和代碼如下：JQuery UI內聯DatePicker在ASP.NET回發後失去選定的日期，如何保留它？

<div id="test"></div> 
<asp:TextBox ID="txtRDate" runat="server" Width="120px" ClientIDMode="Static" AutoPostBack="True" OnTextChanged="txtRDate_TextChanged"> 
</asp:TextBox>

JavaScript代碼：

<script type="text/javascript"> 
$('#test').datepicker({ 
dateFormat: 'yy/mm/dd', 
minDate: new Date(2017, 1, 1), 
defaultDate: new Date(), 

onSelect: function(date, obj){ 
$('#txtRDate').val(date); //Updates value of date 
$('#txtRDate').trigger('change'); 
} 
}); 
</script>

當從日期選擇器的框TextChanged爲文本框選擇日期發射，做回發。

C＃代碼隱藏：

 protected void txtRDate_TextChanged(object sender, EventArgs e) 
    { 
     GetData(txtRDate.Text); 
    }

JQuery用戶界面內嵌的DatePicker ASP.NET回發後會失去選擇的日期，如何保持呢？

在此先感謝。

enter image description here

來源

2017-04-07 S. Fawzy

我已經添加在您的文章中的jsfiddle鏈接，您可以解釋一下究竟是什麼這是錯誤的？ –

@ Vijendra Kulhade如何在自動回發事件（txtRDate_TextChanged）後選擇日期值作爲查詢日期選擇器？ –

爲什麼日期選取器與文本框不同的對象？我將#test更改爲#txtRDate，並通過我的aspx頁面發佈。 – Bindrid

我改變了我的測試環境中的一些細微的變化，它的所有作品。
我添加了moments.js（http://momentjs.com）庫，並用它將日期初始化爲當前日期，如果文本框不爲空。

對jQuery做了一些小的改動，特別是目標元素。第二個文本框僅用於查看服務器在每次命中時通過串聯「1」。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="LaptopWeb.test" %> 

    <!DOCTYPE html> 

    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head runat="server"> 
     <title></title> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
     <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css"/> 
     <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       if ($("#txtRDate").val() == "") { 
        $("#txtRDate").val(moment().format("YYYY/MM/DD")) 
       } 
       $('#txtRDate').datepicker({ 

        dateFormat: 'yy/mm/dd', 
        minDate: new Date(2017, 1, 1), 
        onSelect: function(date, obj){ 
         $('#txtRDate').trigger('change'); 
        } 
       }); 
      }); 
     </script> 
    </head> 
    <body> 
     <form id="form1" runat="server"> 
     <div> 
      <asp:TextBox ID="txtRDate" AutoPostBack="true" runat="server"></asp:TextBox> 
      <asp:TextBox ID="txtCount" runat="server"></asp:TextBox> 
     </div> 
     </form> 
    </body> 
    </html>

服務器端：

using System; 
    using System.Collections.Generic; 
    using System.Linq; 
    using System.Web; 
    using System.Web.UI; 
    using System.Web.UI.WebControls; 

    namespace LaptopWeb 
    { 
     public partial class test : System.Web.UI.Page 
     { 
      protected void Page_Load(object sender, EventArgs e) 
      { 
       txtCount.Text = txtCount.Text + " 1"; 
      } 
     } 
    }

來源

2017-04-08 18:28:58 Bindrid

與一些小的改動工作：

<script type="text/javascript"> 
 
    $('#test').datepicker({ 
 
     dateFormat: 'yy/mm/dd', 
 
     minDate: new Date(2017, 1, 1), 
 
     defaultDate: $('#txtRDate').val(), 
 
     onSelect: function (date, obj) { 
 
      $('#txtRDate').val(date); //Updates value of date 
 
      //Add the value to hidden field 
 
      $('#HiddenField1').val(date); 
 
      $('#txtRDate').trigger('change'); 
 
      
 
      
 
     } 
 
     
 
    }); 
 

 
    $(document).ready(function() { 
 
     //Assign the value from hidden field to textbox 
 
    onLoad: $('#txtRDate').val($('#HiddenField1').val()); 
 
    }); 
 
</script>

來源

2017-04-09 10:07:30

JQuery UI內聯DatePicker在ASP.NET回發後失去選定的日期，如何保留它？

回答

相關問題