回发后，jquery datepicker ms ajax updatepanel不起作用

所以我做了一些相关问题的阅读，并有一些有趣的东西，但没有找到我的答案，至少没有理解答案。

我对AJAX，javascript和sclient side scripting一般都是新手。

我一直在使用C＃asp.net，最近添加了一些更新面板，以平滑用户控件和更新位，以便每次都不重新加载页面。 一切都很出色，我很高兴，直到我决定尝试使用一些JQuery。

我从ui.jquery.js中选择了一个很好的日期选择器，它在普通页面上运行得很好。 当我在updatepanel中进行回发时，我的问题就出现了。 datepicker刚停止工作。

根据我的阅读，我需要在回发后手动连接这个。

1）我真的不明白为什么。 在我的主页上我有：

 $(function() { $(".mydatepickerclass").datepicker({dateFormat: 'dd-mm-yy'}); });  

它使用分配的mydatepickerclass获取我的输入框。 所有的作品。 为什么这会停止回发。

2）我如何解决这个问题….如何连接它，以便在updatepanel中回发后它仍然有效。

我知道ID可能会在回发时发生变化，我认为但是当我使用类时，我不知道出了什么问题。

编辑

我的usercontrol中有以下代码，其中发生了更新：

    
 
Activity History
  $(function() { $(".mydatepickerclass").datepicker({dateFormat: 'dd-mm-yy'}); });  
  Date From: Date To:   
 
  

updatepanel中的脚本不会重新连接吗？

谢谢

乔恩霍金斯

Answer 1

更新面板将重新加载html的内容。 您必须侦听UpdatePanel以完成并重新创建日期选择器。

这是一个非常基本的样本。 这不会考虑页面上的多个更新面板或未正确销毁日期选择器的潜在内存泄漏。

混合ASP.NET Ajax和jQuery时要注意的另一点需要注意，因为两者都在不同的上下文中使用$

Answer 2

我知道这是旧的但是…尝试替换：

$(document).ready(function() {

有：

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(function () {

Answer 3

而不是这样做有一个简单的替代方案。

在更新面板中元素的回发中添加此代码

 ScriptManager.RegisterStartupScript(Me, Me.GetType(), "asddas", "getjquerydate();", True) 

这在javascript中

 function getjquerydate() { $(".datepicker").datepicker({ numberOfMonths: 2, showButtonPanel: true, minDate: 1, dateFormat: 'dd/mm/yy', showOn: "button", buttonImage: "images/calendar.gif", buttonImageOnly: true }); 

}

在更新的面板中进行部分回发后，它再次调用datepicker函数

Answer 4

 $(document).ready(function () { Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler); Sys.WebForms.PageRequestManager.getInstance().beginAsyncPostBack(); function EndRequestHandler(sender, args) { $('.mydatepickerclass').datepicker({ dateFormat: 'dd-mm-yy' }); } }); 

你可以这样做。 在这种情况下，它将始终工作;））

Answer 5

“在ajax部分回发之后，jQuery UI Datepicker不起作用”

在页面上放置脚本管理器和更新面板。

现在在updatepanel控件中放置一个文本框和一个按钮。

    
 Select Date :   
    

现在将datepicker控件与文本框绑定。

现在为按钮创建服务器端单击，这将导致ajax部分回发。

 protected void btnAjax_Click(object sender, EventArgs e) { System.Threading.Thread.Sleep(1000); } 

在运行页面时，你会看到类似的东西

单击datepicker。 日期选择器打开，所选日期变为文本框的值。 现在点击按钮。 服务器端按钮单击被调用，现在您将看到类似这样的内容。

datepicker按钮不见了。那么我们现在要做什么才能让它在ajax中运行。 见下面的代码。

如果您使用的是ASP.NET ajax，则可以在JavaScript中使用pageLoad（）函数。 AJAX框架自动将名为pageLoad（）的任何客户端函数连接为Application.Load处理程序

来源链接积分

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

Answer 6

 Sys.Application.add_load(LoadHandler); //This load handler solved update panel did not bind date picker after partial postback function LoadHandler() { $(document).ready(function () { $(".datepicker").datepicker({ dateFormat: "M d, yy", changeMonth: true, changeYear: true, onSelect: function (dateText, ubst) { your code here... } }).val(); }); } 

Answer 7

我知道这是一个老post，但我刚遇到这个问题并在这个post中找到了答案。 希望它可以帮助任何遇到这个的人。

我没有在后面的代码中放置任何客户端脚本。 我只把这段代码：

上面的代码需要在body部分内，而不是head部分。 我尝试在脚本管理器之前和之后，或者在UpdatePanel的内部和外部放置它，并且发现所有选项都没有问题。 所以只要这段代码在正文部分，它就适合我。

只需确保更改已定义的datetimepicker类。 因为我的是js文件中的“default-date-picker”。

Answer 8

我知道这篇文章很老 – 但只是将你的jquery datepicker放在更新面板之外 – 应该100％工作……