How can I execute JavaScript from my code after my UpdatePanel has finished loading its DOM elements?

I have an UpdatePanel with a repeater that is re-linked after the user adds an item to it through a modal popup.

When they press a button to add a new line to the repeater, the code-code looks something like this:

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?

}

This works great and a new line will display quickly through UpdatePanel.

However, there are often hundreds of rows, and a new one is added based on the currently used sort column.

, jQuery ScrollTo. , div , .

:

  • , ClientID.
  • 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);

, , JavaScript , UpdatePanel ?

+3
2

, , , JS . add_endRequest. - . , "end ajax", , . , , .

var prm = Sys.WebForms.PageRequestManager.getInstance();
jQuery(document).ready(function () {
    prm.add_endRequest(EndRequestHandler);
});

function EndRequestHandler(sender, args) {
  // do whatever you need to do with the stuff in the update panel.
}

, , .

+1

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);
0

Source: https://habr.com/ru/post/1753458/


All Articles