在UpdatePanel完成加载DOM元素后，如何从代码隐藏中执行JavaScript？

Question

我有一个带有转发器的UpdatePanel，在用户通过模式弹出窗口向其添加项目后重新绑定。

当他们点击按钮向转发器添加新行时，代码隐藏看起来像这样：

protected void lbtnAddOption_Click(object sender, EventArgs e)
{               
    SelectedOption = new Option()
    {
        Account = txtAddOptionAccountNumber.Text,
        Margin = chkAddOptionMargin.Checked,
        Symbol = txtAddOptionSymbol.Text,
        Usymbol = txtAddOptionUsymbol.Text,
     };

     Presenter.OnAddOption(); // Insert the new item
     RefreshOptions(); // Pull down and re-bind all the items
     mpeAddOptionDialog.Hide(); // Hide the modal 

     // ... Make call to jQuery scrollTo() method here?

}

这样可以正常工作，新行将通过UpdatePanel快速显示。

但是，通常会有数百行，而新添加的行则基于当前使用的排序列。

所以，我想把它作为使用甜蜜jQuery ScrollTo plugin的机会。我知道如果我给它溢出的容器div的ID和其中元素的ID，它将平滑地直接滚动到用户新添加的行。

然而，有两个问题：

1. 我需要找到合适的行，以便我可以抓住它的ClientID。
2. 我需要从我的代码隐藏执行jQuery代码段，这会导致我新更新的转发器滚动到右侧。

我已经解决了＃1。我有一个可靠的方法，可以生成新添加的行的ClientID。

然而，问题＃2被证明是棘手的。我知道我可以通过代码隐藏来调用ScriptManager.RegisterStartupScript()，它将在我的页面上执行JavaScript。

我遇到的问题是它似乎正在执行那段JavaScript（我猜）新刷新的DOM元素已经完全加载。所以，即使我传入适当的jQuery行来滚动到我想要的元素，它也是错误的，因为它找不到那个元素。

以下是我在上面发布的方法结尾处使用的行：

     string clientID = getClientIdOfNewRow();  
     ScriptManager.RegisterStartupScript(this, typeof(Page), "ScrollScript", String.Format("$(\"#optionContainer\").scrollTo(\"{0}\", 800);", clientID), true);

我需要做什么才能确保在具有UpdatePanel的页面准备就绪之前不会调用这一行JavaScript？

Answer 1

Answer 2

您可以使用在加载所有脚本并创建并初始化应用程序中的对象后引发的Sys.Application.load事件。

所以你的代码是：

string clientID = getClientIdOfNewRow();         
ScriptManager.RegisterStartupScript(this, typeof(Page)
    ,"ScrollScript"
    ,String.Format("Sys.Application.add_load(function(){{$(\"#optionContainer\").scrollTo(\"{0}\", 800);}});"
    , clientID)
    , true);