Ajout d'un événement côté serveur au contrôle de l'extendeur

Question

J'ai un contrôle d'extension qui augmente le niveau d'une zone de texte OnTextChanged événement 500 ms après que l'utilisateur a fini de taper.Le problème avec ça c'est que OnTextChanged est déclenché lorsque la zone de texte perd le focus, ce qui pose des problèmes (à cause de la publication).

Ce que j'aimerais faire, c'est donner au contrôle du répéteur son propre événement côté serveur (par exemple, OnDelayedSubmit) pour que je puisse le gérer séparément.L'événement proviendra du script de comportement du contrôle d'extension (après le délai de 500 ms), donc en mettant un __doPostBack dans onchanged n'est pas une option.

Quelqu'un peut-il nous éclairer sur la façon de procéder?

Answer 1

Après de nombreuses lectures sur les contrôles d'extension et JavaScript, j'ai concocté une solution qui semble fonctionner jusqu'à présent.

L'astuce principale consistait à obtenir le code de publication nécessaire du côté serveur vers le script de comportement côté client.Je l'ai fait en utilisant un ExtenderControlProperty (qui est défini dans le contrôle OnPreRender fonction), puis évalué dans le script de comportement.Le reste était constitué de tâches de base liées à la gestion des événements.

Alors maintenant, mon contrôle d'extension .cs le fichier ressemble à ceci :

public class DelayedSubmitExtender : ExtenderControlBase, IPostBackEventHandler
{
    // This is where we'll give the behavior script the necessary code for the 
    // postback event
    protected override void OnPreRender(EventArgs e)
    {
        string postback = Page.ClientScript.GetPostBackEventReference(this, "DelayedSubmit") + ";";
        PostBackEvent = postback;
    }

    // This property matches up with a pair of get & set functions in the behavior script
    [ExtenderControlProperty]
    public string PostBackEvent
    {
        get
        {
            return GetPropertyValue<string>("PostBackEvent", "");
        }
        set
        {
            SetPropertyValue<string>("PostBackEvent", value);
        }
    }

    // The event handling stuff
    public event EventHandler Submit;  // Our event

    protected void OnSubmit(EventArgs e)  // Called to raise the event
    {
        if (Submit != null)
        {
            Submit(this, e);
        }
    }

    public void RaisePostBackEvent(string eventArgument)  // From IPostBackEventHandler
    {
        if (eventArgument == "DelayedSubmit")
        {
            OnSubmit(new EventArgs());
        }
    }

}

Et mon script de comportement ressemble à ceci :

DelayedSubmitBehavior = function(element) {
    DelayedSubmitBehavior.initializeBase(this, [element]);

    this._postBackEvent = null; // Stores the script required for the postback
}

DelayedSubmitBehavior.prototype = {
    // Delayed submit code removed for brevity, but normally this would be where 
    // initialize, dispose, and client-side event handlers would go

    // This is the client-side part of the PostBackEvent property
    get_PostBackEvent: function() {
        return this._postBackEvent;
    },
    set_PostBackEvent: function(value) {
        this._postBackEvent = value;
    }

    // This is the client-side event handler where the postback is initiated from
    _onTimerTick: function(sender, eventArgs) {
        // The following line evaluates the string var as javascript,
        // which will cause the desired postback
        eval(this._postBackEvent);
    }
}

Désormais, l'événement côté serveur peut être géré de la même manière que vous géreriez un événement sur n'importe quel autre contrôle.