web-dev-qa-db-fra.com

Comment puis-je exécuter du javascript après une actualisation du panneau de mise à jour?

J'ai une fonction pageLoad qui définit des CSS sur un contrôle .ascx que je ne peux pas changer. Au chargement de la page, tout va bien, mais lorsqu'un panneau de mise à jour met à jour le contrôle, mon CSS n'est plus appliqué. Comment puis-je réexécuter ma fonction après la mise à jour de la page?

 $(function() {
        $("textarea").attr("cols", "30");
        $("input.tbMarker").css({ "width": "100px" }).attr("cols","25");
    });

Cela ne fonctionne évidemment que lors du chargement initial de la page. Comment puis-je l'exécuter après une mise à jour?

asp.netjavascriptjqueryupdatepanel
56
Hcabnettek

L'ajout d'un gestionnaire add_pageLoaded peut également fonctionner.

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(PageLoadedHandler);

Remarque: le gestionnaire se déclenchera pour tout rappel, mais vous pouvez utiliser sender._postBackSettings.panelID pour filtrer quand vous voulez que votre fonction soit appelée.

Plus d'échantillons:

43
brianng

Le moyen le plus simple consiste à utiliser MSAjax pageLoad Event dans votre code javascript:

<script> 
   ///<summary>
   ///  This will fire on initial page load, 
   ///  and all subsequent partial page updates made 
   ///  by any update panel on the page
   ///</summary>
   function pageLoad(){ alert('page loaded!') }  
</script>

Je l'ai utilisé plusieurs fois, ça marche comme du charme. La chose la plus importante est de ne pas la confondre avec la fonction document.ready (qui ne sera exécutée qu'une seule fois après que la page Document Object Model (DOM) soit prête pour l'exécution du code JavaScript), mais pageLoad Event sera exécuté à chaque fois que le panneau de mise à jour rafraîchit.

Source: Exécution du script après le panneau de mise à jour AJAX asp.net

87
Kartikay Tripathi

Lors de votre publication pour le panneau de mise à jour, dans le code du serveur, utilisez ClientScriptManager pour ajouter un nouveau script à la page, quelque chose comme ceci:

ClientScriptManager.RegisterStartupScript(
       typeof(page1), 
       "CssFix", 
       "javascriptFunctionName()", 
        true);

Encapsulez votre javascript dans une fonction nommée qui correspond au troisième argument, et il devrait s'exécuter lorsque la publication revient.

14
womp

Ajoutez le code sous la même forme que vous avez placée votre gestionnaire de scripts.

Code derrière:

protected void Page_Load(object sender, EventArgs e)
{
    if (ScriptManager1.IsInAsyncPostBack)
    {
        StringBuilder sb = new StringBuilder();
        sb.Append("<script language='javascript' type='text/javascript'>");
        sb.Append("Sys.Application.add_load(func);");
        sb.Append("function func() {");
        sb.Append("Sys.Application.remove_load(func);");
        sb.Append("alert('I am Batman!');");
        sb.Append("}");
        sb.Append("</script>");
        ScriptManager.RegisterStartupScript(this, GetType(), "script", sb.ToString(), false);
    }
}
14
Marco Ramires

Vous pouvez également vous lier à un événement dans le code côté client (JavaScript) chaque fois qu'un UpdatePanel a terminé comme ceci:

        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(){myFunction();});

Donc, dans ce cas, myFunction (); sera appelé à chaque fois qu'une publication UpdatePanel se produira. Si vous exécutez ce code lorsque la page est chargée, la fonction sera appelée au bon moment.

12
Peter Eysermans