填充 GridView 后 Jquery 日历不会重新加载答案

【问题标题】：Jquery calendar does not reload after GridView is populated填充 GridView 后 Jquery 日历不会重新加载
【发布时间】：2015-12-11 18:42:02
【问题描述】：

我有一个包含Jquery datepicker、UpdateProgress 和GridView 的简单页面，位于UpdatePanel 内。

这是页面中的一个片段：

...
    Select From Date: <input type="text" id="datepickerfrom" name="datepickerfrom"/>
    Select To Date: <input type="text" id="datepickerto" name="datepickerto"/>
    <asp:Button ID="btnGetData" runat="server" OnClick="BtnGetData_Click" Text="Get Error List" />
    <asp:UpdateProgress ID="UpdateProgress1" runat="server">
        <ProgressTemplate>
           <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/ajax-loader.gif" />  
        </ProgressTemplate>
    </asp:UpdateProgress>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
      ...MyGrid...
    </ContentTemplate>
    </asp:UpdatePanel>
...

这是点击按钮时调用的code behind方法：

protected void BtnGetData_Click(object sender, EventArgs e)
{
    string dateFrom = HttpUtility.HtmlEncode(Request.Form["datepickerfrom"]);
    string dateTo = HttpUtility.HtmlEncode(Request.Form["datepickerto"]);
    InputData data = new InputData(dateFrom, dateTo);
    Session["inputData"] = data;
    gvErrorLog.PageIndex = 0;
    LoadLogErrorData(data);      
}

当我第一次加载页面并单击其中一个日期文本框时，会弹出jQuery datepicker。当我刷新页面时，它也会弹出。

但是，单击按钮并用数据填充GridView 后，它不再显示。

可能是什么原因？

【问题讨论】：

标签： c# jquery asp.net datagridview code-behind

【解决方案1】：

你的标签是

<input type="text" id="datepickerfrom" name="datepickerfrom"/>

这确实是常规的 html 标签。 Microsoft ASP.NET 不保留常规 html 标记的状态（即在 ViewState 中）。回发后，页面生命周期有效地创建了一个新的 Page (System.Web.UI.Page) 对象实例，然后将响应作为 html 发送回浏览器。

另一方面，一旦你改为

<asp:TextBox ID="datepickerfrom" runat="server" />

您将在回发中看到它。您在后面的代码中捕获这两个日期的方式也已过时（仅在 ASP 1.1 中可见）。

您的文本标签的命名空间是 System.Web.UI.HtmlControls.HtmlInputText，服务器标签的命名空间是 System.Web.UI.WebControls.TextBox。它们属于不同的命名空间。 HtmlControls 中的任何控件都用于旧版目的。

您可以更改为 asp:TextBox 并从后面的代码中访问它们，如下所示：

protected void BtnGetData_Click(object sender, EventArgs e)
{   
    string dateFrom = datepickerfrom.Text;  //  -- updated 
    string dateTo = datepickerto.Text;      //  -- updated 
    InputData data = new InputData(dateFrom, dateTo);
    Session["inputData"] = data;
    gvErrorLog.PageIndex = 0;
    LoadLogErrorData(data);  
}

如果你坚持你的标签，你可以添加一个隐藏变量并在你的文本框发生变化时更新这些隐藏变量。

我假设您的文本框设置如下

$(function () {
    $("#<%=datepickerfrom.ClientID%>").datepicker();
    $("#<%=datepickerto.ClientID%>").datepicker();
});

【讨论】：

改成这个后，回发后，datepicker控件无论如何都不会显示
你如何设置你的日期选择器？
$(function () { $("#MainContent_ucMainDisplay_datepickerfrom").datepick(); $("#MainContent_ucMainDisplay_datepickerto").datepick(); });这种方式在页面第一次加载时显示日历
当你说它“不”显示时，你的意思是你点击后看不到日历弹出窗口？或者您希望在没有用户干预的情况下在回发后立即看到日历弹出窗口？
用户点击文本框会弹出日历

【解决方案2】：

我终于在这里找到了我的问题的答案：

http://www.jquerybyexample.net/2010/08/jquery-datepicker-does-not-work-after.html

【讨论】：