将服务器端事件添加到扩展程序控件
时间:2020-03-05 18:45:51 来源:igfitidea点击:
我有一个扩展程序控件,该控件在用户完成键入后500毫秒引发一个文本框的" OnTextChanged"事件。问题是当文本框失去焦点时会引发OnTextChanged,这会导致问题(由于回发)。
我想做的是让扩展程序控制自己的服务器端事件(例如,OnDelayedSubmit),以便我可以单独处理它。该事件将源于扩展程序控件的行为脚本(在500ms延迟之后),因此不能将" __doPostBack"放入" onchanged"。
谁能阐明该如何做?
解决方案
回答
在对扩展程序控件和JavaScript进行了大量的阅读之后,我已经拼凑出了一个到目前为止似乎一直有效的解决方案。
主要技巧是从服务器端到客户端行为脚本获取必要的回发代码。我通过使用" ExtenderControlProperty"(在控件的" OnPreRender"函数中设置)来完成此操作,然后在行为脚本中进行评估。其余的是基本的事件处理内容。
所以现在我的扩展程序控件的.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()); } } }
我的行为脚本看起来像这样:
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); } }
现在,可以像处理其他控件上的事件一样处理服务器端事件。