将服务器端事件添加到扩展程序控件

I have an extender control that raises a textbox's OnTextChanged event 500ms after the user has finished typing. The problem with this is that OnTextChanged gets raised when the textbox loses focus, which causes problems (because of the postback).

我有一个扩展程序控件，在用户输入完成后500ms引发文本框的OnTextChanged事件。这个问题是当文本框失去焦点时会引发OnTextChanged，这会导致问题（因为回发）。

What I'd like to do is give the extender control its own server-side event (say, OnDelayedSubmit) so I can handle it separately. The event will originate in the extender control's behavior script (after the 500ms delay), so putting a __doPostBack in onchanged is not an option.

我想做的是让扩展器控制它自己的服务器端事件（比如OnDelayedSubmit），这样我就可以单独处理它了。该事件将起源于扩展器控件的行为脚本（在500ms延迟之后），因此将__doPostBack置于onchanged中是不可取的。

Can anyone shed light on how to go about this?

任何人都可以阐明如何解决这个问题吗？

1 个解决方案

#1

After plenty of reading up on extender controls and JavaScript, I've cobbled together a solution that seems to be working so far.

在充分阅读了扩展器控件和JavaScript之后，我拼凑了一个似乎到目前为止工作的解决方案。

The main trick was getting the necessary postback code from server-side to the client-side behavior script. I did this by using an ExtenderControlProperty (which is set in the control's OnPreRender function), and then eval'd in the behavior script. The rest was basic event-handling stuff.

主要技巧是从服务器端获取必要的回发代码到客户端行为脚本。我通过使用ExtenderControlProperty（在控件的OnPreRender函数中设置），然后在行为脚本中进行评估来完成此操作。剩下的就是基本的事件处理。

So now my extender control's .cs file looks something like this:

所以现在我的扩展控件的.cs文件看起来像这样：

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());
        }
    }

}

And my behavior script looks something like this:

我的行为脚本看起来像这样：

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

Now the server-side event can be handled the same way you'd handle an event on any other control.

现在，服务器端事件的处理方式与处理任何其他控件上的事件的方式相同。

#1