运行javascript以在asp.net Ajax调用后重新绑定datepicker

时间:2017-05-15 19:29:08

标签: javascript jquery asp.net ajax datepicker

我有一些Ajax写在我的代码隐藏中的一些控件上,asp:UpdatePanel内部的一个控件是一个文本框,其中绑定了一个jQuery datepicker小部件。触发Ajax调用并刷新面板时,由于刷新而导致绑定的datepicker小部件丢失,需要重新绑定。我的问题是:在asp:UpdatePanel刷新后,有什么方法或方法可以让我再次运行一些javascript吗?

更新:

<script type="text/javascript" language="javascript">
    //Here I'm initially binding the datepicker to the txtFirstIllDate control, works great
    $(document).ready(function () {
        $('#<%= txtFirstIllDate.ClientID %>').datepicker(({
            startDate: "01/01/1990",
            showOn: "both",
            buttonImage: "Images/calendar_2.png",
            buttonImageOnly: true,
            buttonText: "Select first ill date"
        }));
    });
</script>

<asp:ScriptManager ID="ScriptManager1" runat="server" />
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
                <ContentTemplate>
                        <asp:Label ID="lblStateID" runat="server" Text="State ID:"></asp:Label><asp:TextBox ID="txtStateID" runat="server" Width="40%" CssClass="floatRight" MaxLength="50"></asp:TextBox>
                        <asp:Label ID="lblFirstIllDate" runat="server" Text="First Ill Date:"></asp:Label><asp:TextBox ID="txtFirstIllDate" runat="server" Width="40%" CssClass="floatRight"></asp:TextBox>                            
                        <asp:Button ID="btnNewReport" runat="server" OnClick="btnNewReport_Click" Text="Create NORS Report" CssClass="marginBottom10px" />
                        <div class="clearFloat">
                            <asp:Label ID="lblErrorReportName" runat="server" ForeColor="Red" Font-Bold="true" Visible="false" CssClass="blockItem"></asp:Label>
                            <asp:Label ID="lblErrorFirstIll" runat="server" ForeColor="Red" Font-Bold="true" Visible="false" CssClass="blockItem"></asp:Label>
                            <asp:Label ID="lblErrorEstimatedPrimary" runat="server" ForeColor="Red" Font-Bold="true" Visible="false" CssClass="blockItem"></asp:Label>
                            <asp:Label ID="lblErrorModeOfTransmission" runat="server" ForeColor="Red" Font-Bold="true" Visible="false" CssClass="blockItem"></asp:Label>
                        </div>                            
                </ContentTemplate>
            </asp:UpdatePanel>




// Code behind when btnNewReport is pressed
    protected void btnNewReport_Click(object sender, EventArgs e)
    {
        if (IsValidEntry())
        {
            //After all this code is ran and the panel is updated,
            //the txtFirstIllDate control looses its datepicker widget.
            //How do I get js to run again after the ajax panel update?
        }
    }

1 个答案:

答案 0 :(得分:0)

ASP.NET UpdatePanel实现了JavaScript XMLHttpRequest对象,以处理来自具有AJAX功能的服务器的响应。

在ASP.NET页面中添加ScriptManager和UpdatePanel控件时,在内部从Microsoft加载一个客户端脚本库,它具有与XMLHttpRequest对象相关的函数。

内部存在其他功能(来自Microsoft的脚本库)(。axd文件)。

通过ScriptManager - UpdatePanel的每个响应都在ASP.NET生命周期事件中处理。

你可以尝试这样的事情:

function pageLoad(sender, args) { // This function name is reservaded in ASP.NET AJAX when you use a ScriptManager in the page.

  $('#<%= txtFirstIllDate.ClientID %>').datepicker(({
    startDate: "01/01/1990",
    showOn: "both",
    buttonImage: "Images/calendar_2.png",
    buttonImageOnly: true,
    buttonText: "Select first ill date"
  }));

}

您可以在此link(Ajax客户端生命周期事件)中找到更多信息。