Comment faire pour avoir un javascript de rappel exécutée après une mise à jour du panneau de publication?

Question

Je suis en utilisant une astuce jQuery plugin pour afficher des bulles d'aide lorsque l'utilisateur place le pointeur de certains éléments de la page.

J'ai besoin d'enregistrer le plugin événements après le chargement de la page à l'aide de sélecteurs css.

Le problème est que je suis en utilisant un ASP.NET Panneau de mise à Jour et après la première publication, les conseils d'arrêter de travailler parce que le panneau de mise à jour remplace le contenu de la page, mais ne pas relier les événements javascript.

J'ai besoin d'un moyen d'exécuter un javascript de rappel après le Panneau de mise à Jour actualise son contenu, de sorte que je peux relier les événements javascript pour avoir des conseils pratiques de travail à nouveau.

Est-il possible de faire cela?

Answer 1

Au lieu de mettre votre code jQuery à l'intérieur de l' $(document).ready(), le mettre à l'intérieur

function pageLoad(sender, args) { 
    ... 
}

pageLoad est exécuté après chaque publication, synchrone ou asynchrone. pageLoad est réservé le nom de la fonction ASP.NET AJAX c'est pour ce but. $(document).ready() d'autre part, est exécutée qu'une seule fois, lorsque le DOM est d'abord prêt/chargé.

Voir cette vue d'ensemble de ASP.NET AJAX client événements de cycle de vie

Et aussi de prendre un coup d'oeil à Dave Ward, après la grande - $(document).prêt() et pageLoad() ne sont pas les mêmes!

Answer 2

Le pageLoad n'a pas fonctionné. J'ai utilisé ceci à la place:

var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_pageLoaded(pageLoaded);

fonction pageLoaded() { }

Answer 3

Ce n'est sans doute pas la solution la plus élégante, mais son une solution néanmoins:

public class UpdatePanel : System.Web.UI.UpdatePanel
{
    /// <summary>
    /// Javascript to be run when the updatepanel has completed updating
    /// </summary>
    [Description("Javascript to be run when the updatepanel has completed updating"),
    	Category("Values"),
    	DefaultValue(null),
    	Browsable(true)]
    public string OnUpdateCompleteClientScript
    {
    	get
    	{
    		return (string)ViewState["OnUpdateCompleteClientScript"];
    	}
    	set
    	{
    		ViewState["OnUpdateCompleteClientScript"] = value;
    	}
    }

    protected override void OnPreRender(System.EventArgs e)
    {
    	base.OnPreRender(e);
    	if(!string.IsNullOrEmpty(this.OnUpdateCompleteClientScript))
    		Page.ClientScript.RegisterStartupScript(this.GetType(), this.ClientID, string.Concat("Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender, args){for(var panelId in sender._updatePanelClientIDs){if(sender._updatePanelClientIDs[panelId] == '", this.ClientID, "'){", this.OnUpdateCompleteClientScript, "}}});"), true);
    }
}

L'utiliser comme ceci:

<uc:UpdatePanel OnUpdateCompleteClientScript="alert('update complete');">
    <!-- stuff in here -->
</uc:UpdatePanel>

Bien sûr, vous aurez besoin d'enregistrer le contrôle personnalisé dans youre webconfig ou de la page à utiliser de la sorte.

Edit: aussi, avez-vous regardé jquery.live?

Answer 4

Trouvé une solution élégante ici:

http://www.codeproject.com/tips/51788/Ajax-Identify-the-control-that-caused-the-Async-Po.aspx