异步回发不会导致 document.ready 被执行 [英] Async postback doesn't cause document.ready to be executed

问题描述

我不得不对几个页面中使用的用户控件进行一些更改.用户控件包含一些 JQuery 来处理分页任务(显示 3 个月的数据并一次隐藏 9 个).当控件加载时，它会自动显示当前季度并执行 $(document).ready() 中的这段代码.

I've had to implement some changes to a user control that's used in a couple of pages. The user control contains some JQuery to handle a paging task (displays 3 months of data and hides 9 at a time). When the control is loaded, it will automatically display the current quarter and executes this code in $(document).ready().

我遇到的问题是，在使用用户控件的页面之一中，该控件在页面加载时不可见.异步回发用于更改可见性，但这不会执行 ready().

The problem I have is that in one of the pages the user control is used, the control isn't visible on page load. An async postback is used to change the visibility but this doesn't execute ready().

我发现了一个片段，它允许托管页面拦截部分回发的 EndResponse，但我仍然无法在用户控件中执行该功能.

I found a snippet which allows the hosting page to intercept the EndResponse of the partial postback but I still can't execute the function within the usercontrol.

大家有什么建议吗?

干杯

戴夫

推荐答案

和我一样，你会讨厌微软规定的答案.规定"的答案是使用 PageRequestManager 来设置请求处理程序.这个请求处理程序(然后)在每个部分回发完成后执行.

As I did, you're going to hate the prescribed Microsoft answer. The "prescribed" answer is to use the PageRequestManager to setup a request handler. This request handler is (then) executed after each partial-postback is completed.

请求处理程序示例:

<script id="events" type="text/javascript">

    jQuery(document).ready(function() {

        // Your normal code goes here
        setupSomething();
        initializeSomethingElse();

        // Setup your partial-postback event handler.
        // This is used to rewire all events since all are 'lost' after partial-postback.
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(requestHandler);
    });

    ///<summary>partial postback event handler. Executed after the partial postback is completed. Clears modal popup textboxes</summary>
    ///<param name="sender"></param>
    ///<param name="args">http://www.asp.net/ajax/documentation/live/ClientReference/Sys.WebForms/EndRequestEventArgsClass/default.aspx</param>
    function requestHandler(sender, args) {

        if (args.get_error() == undefined) {

            // Your normal code goes here
            setupSomething();
            initializeSomethingElse();
        }
        else
            alert(args.get_error()); // Do something
    }
</script>

这给我们带来了简单的答案:
为什么不从您的代码隐藏中显式初始化您的用户控件，并将初始化 JavaScript 保留在您的用户控件 HTML(本身)中.

That Brings Us To The Simple Answer:
Why not initialize your user-control explicitly from your code-behind and keep that initializing JavaScript within your user-controls HTML (itself).

void YourUserControl_PreRender(object sender, EventArgs e)
{
    try
    {

    }
    catch (Exception ex)
    {

    }
    finally 
    {
        // Do this
        ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), "registerInitializer", buildInitializer(), true);
    }
}

一旦呈现，buildInitializer"逻辑会说，如果这个函数存在于客户端......调用它."而且……每次都有效.

Once rendered, the "buildInitializer" logic says, "If this function exists on the client...call it." And...it works every time.

private string buildInitializer()
{
    StringBuilder javascript = new StringBuilder();

    javascript.Append("if (window.initializeMyControl) {");
    javascript.Append("if(typeof window.initializeMyControl == 'function') { initializeMyControl(); }");
    javascript.Append("}");

    return javascript.ToString();
}

现在您的用户控件初始化可以存在于用户控件应有的位置:

<script type="text/javascript">
    function initializeMyControl() {

        // Your normal code goes here
        setupSomething();
        initializeSomethingElse();
    }
</script>

这篇关于异步回发不会导致 document.ready 被执行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！