当结合了jQuery UI的DatePicker一个ASP.NET的UpdatePanel奇怪的bug [英] Weird bug when combining an ASP.NET updatepanel with the jQuery UI DatePicker

查看:110
本文介绍了当结合了jQuery UI的DatePicker一个ASP.NET的UpdatePanel奇怪的bug的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经创建了一个网页,其中结合了内联 jQuery UI的日期选择器。我wan't当用户点击一个新的日期更新一些数据开始回调在UpdatePanel。现在,这个页面有多个的UpdatePanel(不要问:)),所以我需要检查它的UpdatePanel,以做一些东西,客户方做了重装。我使用 __ doPostBack 做回发 Sys.WebForms.PageRequestManager.getInstance()。add_endRequest(功能(发送器,参数){} 来听时,更新完成了。

I've created a page which combines an inline jQuery UI datepicker . I wan't to initiate a callback to the updatepanel when the user clicks a new date to update some data. Now, this page has multiple updatepanels (don't ask :) ), so I need to check which updatepanel did the reload in order to do some stuff clientside. I'm using __doPostBack to do the postback and Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender, args) {} to listen for when an update is done.

现在的问题是,在FF回调告诉我,这不是一个异步操作,我需要的数据,必须检查哪些UpdatePanel中没有更新设置为null。

The problem is that in FF the callback tells me that it's not an async operation, and the data I need to have to check which updatepanel did the update is set to null.

我的问题是,这工作正常,在IE浏览器,而不是在其他任何浏览器,这可能是由两件事情引起的:IE浏览器进入一个quirksmode这样就解决了这个问题(这就是我的想法),或IE浏览器有某种对于其他浏览器不UpdatePanel的原生支持。

My problem is that this works fine in IE, but not in any other browser, which could be caused by 2 things: IE goes into a quirksmode which resolves the issue (this is what I think) or that IE has some sort of native support for the updatepanel that other browsers dont.

我已经缩小的问题分解,并产生了testpage:

I've narrowed the problem down, and produced a testpage:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js "></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js "></script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />

    <script type="text/javascript">
        function doAspNetPostback() {
            __doPostBack('<%= hiddenOnSelectionChangedButton.ClientID %>', '');
        }

        $(document).ready(function() {
            /* Create the datepicker */
            buildDatepicker();
            /* Add callback-method for when the scriptmanager finished a request */
            Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender, args) {
                /* Show the panelID - This is 'upd1|hiddenOnSelectionChangedButton' in IE as it should be, and null in Chrome / FF */
                alert(sender._postBackSettings.panelID);
            });
        });

        function buildDatepicker() {
            var dp = $("#datepicker").datepicker({
                onSelect: function(dateText, inst) {
                    /* Do a postback when someone clicks a date */
                    doAspNetPostback();
                }
            });
        }        
    </script>

    <div id="datepicker">
    </div>
    <asp:UpdatePanel UpdateMode="Conditional" ID="upd1" runat="server">
        <ContentTemplate>
            <asp:Button ID="hiddenOnSelectionChangedButton" Text="Press me" runat="server" />
            <div id="lala" runat="server">
                Upd1
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
    </form>
</body>
</html>

射击这个testpage在IE浏览器将导致一个消息框,显示它的应该,在加载它在一个消息框它说空FF或Chrome结果:)

Firing this testpage up in IE will result in a messagebox which shows what it's supposed to, while loading it in FF or Chrome results in a messagebox which says "null" :)

我已经试过各种东西,但我不确定,因为我真的不认为深入的jQuery或ASP.NET AJAX的内部工作原理是什么可能会导致此行为。不过,如果我通过code萤火虫足够慢,它的工作原理......这使我想到这一步可能与jQeury回调和ASP.NET AJAX回调?

I've tried all sorts of things, but I'm unsure of what could cause this behaviour as I'm not really that deep into the inner workings of jQuery or ASP.NET Ajax. However, if I step through the code in FireBug slow enough it works ... Which leads me to think it might be a problem with interoperability between jQeury callbacks and ASP.NET Ajax callbacks?

任何帮助或想法将是非常美联社preciated。

Any help or ideas will be highly appreciated.

感谢。

[更新]添解决它!多谢! - 也感谢大家谁花时间试图弄清楚这一点:)

[UPDATE] Tim solved it! Thanks a lot! - Also thanks to everyone who spent their time trying to figure this out :)

推荐答案

我想你我觉得这篇文章从MSDN有趣:的 http://msdn.microsoft.com/en-us/magazine/cc163413.aspx

I think you my find this article from MSDN interesting: http://msdn.microsoft.com/en-us/magazine/cc163413.aspx

文章说,Sys.WebForms.PageRequestManager.getInstance()。 add_pageLoaded (也十分重视的UpdatePanel完整的事件。

The article says that "Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(" also attaches to Updatepanel complete events.

这也激发每个时间   异步回调发动   代表UpdatePanel控件的   完成,里面的内容   UpdatePanel的更新。

It also fires each time an asynchronous callback launched on behalf of an UpdatePanel control completes and the content inside that UpdatePanel is updated.

然后在您的处理程序,您可以通过与updatedpanels环

then in your handler you can loop through the updatedpanels with

var panels = args.get_panelsUpdated();
for (i=0; i < panels.length; i++) { alert(panels[i]); }

我会迷路远离使用_ postBackSettings因为_表示隐私,可以在asp.net阿贾克斯的未来版本将停止使用。

I would stray away from using the _ postBackSettings because of the " _ " denotes privacy and may be discontinued in future versions of asp.net ajax.

这篇关于当结合了jQuery UI的DatePicker一个ASP.NET的UpdatePanel奇怪的bug的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆