[JavaScript]自定义MessageBox续-全面分析PostBack之Client Script

简介:

全面分析PostBack之Client Script


 -Written by 浪子@cnblogs.com (2006.08.14)

问题描述:

 

   继上文[JavaScript]自定义MessageBox ,我还剩下一个问题没有解决,即"如何获取control的完整的客户端代码"?。所以本文解决的问题只涉及PostBack的客户端Script,而不涉及服务端的PostBack机制如何运作。

 

问题分析:

  

   PostBack有2种方式

1、  通过__doPostBack(eventTarget, eventArgument),例如LinkButton;

2、  通过form的submit方式,例如采用UseSubmitBehaviorButton

   

   对于button,可能会有三种绘制方式:

1、  button的UseSubmitBehavior为true,并且没有触发验证事件;

采用form的submit方式,不需要描绘script

2、  button的UserSubmitBehavior为false,并且没有触发验证事件;

采用__doPostBack函数

3、  button有触发验证事件:

采用WebForm_DoPostBackWithOptions(options)函数


ExpandedBlockStart.gif ContractedBlock.gif function WebForm_PostBackOptions(eventTarget, eventArgument, validation, validationGroup, actionUrl, trackFocus, clientSubmit)  dot.gif{
InBlock.gif     this.eventTarget = eventTarget;
InBlock.gif     this.eventArgument = eventArgument;
InBlock.gif     this.validation = validation;
InBlock.gif     this.validationGroup = validationGroup;
InBlock.gif     this.actionUrl = actionUrl;
InBlock.gif     this.trackFocus = trackFocus;
InBlock.gif     this.clientSubmit = clientSubmit;
ExpandedBlockEnd.gif}
None.gif 
ExpandedBlockStart.gif ContractedBlock.gif function WebForm_DoPostBackWithOptions(options)  dot.gif{
InBlock.gif     var validationResult =  true;
ExpandedSubBlockStart.gif ContractedSubBlock.gif     if (options.validation)  dot.gif{
ExpandedSubBlockStart.gif ContractedSubBlock.gif         if ( typeof(Page_ClientValidate) == ' function')  dot.gif{
InBlock.gif            validationResult = Page_ClientValidate(options.validationGroup);
ExpandedSubBlockEnd.gif        }
ExpandedSubBlockEnd.gif    }
InBlock.gif
ExpandedSubBlockStart.gif ContractedSubBlock.gif     if (validationResult)  dot.gif{
ExpandedSubBlockStart.gif ContractedSubBlock.gif         if (( typeof(options.actionUrl) != "undefined") && (options.actionUrl !=  null) && (options.actionUrl.length > 0))  dot.gif{
InBlock.gif            theForm.action = options.actionUrl;
ExpandedSubBlockEnd.gif        }
ExpandedSubBlockStart.gif ContractedSubBlock.gif         if (options.trackFocus)  dot.gif{
InBlock.gif             var lastFocus = theForm.elements["__LASTFOCUS"];
ExpandedSubBlockStart.gif ContractedSubBlock.gif             if (( typeof(lastFocus) != "undefined") && (lastFocus !=  null))  dot.gif{
ExpandedSubBlockStart.gif ContractedSubBlock.gif                 if ( typeof(document.activeElement) == "undefined")  dot.gif{
InBlock.gif                    lastFocus.value = options.eventTarget;
ExpandedSubBlockEnd.gif                }
ExpandedSubBlockStart.gif ContractedSubBlock.gif                 else  dot.gif{
InBlock.gif                     var active = document.activeElement;
ExpandedSubBlockStart.gif ContractedSubBlock.gif                     if (( typeof(active) != "undefined") && (active !=  null))  dot.gif{
ExpandedSubBlockStart.gif ContractedSubBlock.gif                         if (( typeof(active.id) != "undefined") && (active.id !=  null) && (active.id.length > 0))  dot.gif{
InBlock.gif                            lastFocus.value = active.id;
ExpandedSubBlockEnd.gif                        }
ExpandedSubBlockStart.gif ContractedSubBlock.gif                         else  if ( typeof(active.name) != "undefined")  dot.gif{
InBlock.gif                            lastFocus.value = active.name;
ExpandedSubBlockEnd.gif                        }
ExpandedSubBlockEnd.gif                    }
ExpandedSubBlockEnd.gif                }
ExpandedSubBlockEnd.gif            }
ExpandedSubBlockEnd.gif        }
ExpandedSubBlockEnd.gif    }
InBlock.gif
ExpandedSubBlockStart.gif ContractedSubBlock.gif     if (options.clientSubmit)  dot.gif{
InBlock.gif        __doPostBack(options.eventTarget, options.eventArgument);
ExpandedSubBlockEnd.gif    }
ExpandedBlockEnd.gif}
None.gif



 

 

 

问题解决:

 

   我需要的是采集PostBack的Client Script,所以只需要获取__doPostBack或者WebForm_DoPostBackWithOptions(options)函数,以便传给KMessageBox进行事件挂载。

 

   按上面的分析我们已经知道什么情况下使用__doPostBack,什么情况下使用WebForm_DoPostBackWithOptions(options)。

  分析一下Reflector出来的Button源码:
 

ContractedBlock.gif ExpandedBlockStart.gif OnPreRender
 1None.gif if ((this.Page != null) && base.IsEnabled)
 2ExpandedBlockStart.gifContractedBlock.gif      dot.gif{
 3InBlock.gif            if ((this.CausesValidation && (this.Page.GetValidators(this.ValidationGroup).Count > 0)) || !string.IsNullOrEmpty(this.PostBackUrl))
 4ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
 5InBlock.gif                  this.Page.RegisterWebFormsScript();
 6ExpandedSubBlockEnd.gif            }
 7InBlock.gif            else if (!this.UseSubmitBehavior)
 8ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
 9InBlock.gif                  this.Page.RegisterPostBackScript();
10ExpandedSubBlockEnd.gif            }
11ExpandedBlockEnd.gif      }
12None.gif

    有了这段代码,我们就可以很清晰的得到服务端如何决定采取什么方式来绘制客户端的PostBack Script了

ContractedBlock.gif ExpandedBlockStart.gif DoPostBackWithOptions
1ExpandedBlockStart.gifContractedBlock.gifprivate string gDoPostBackWithOptions = "WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(\"dot.gif{0}\", \"dot.gif{1}\", {2}, \"dot.gif{3}\", \"dot.gif{4}\", {5}, {6}))";

   
None.gifIButtonControl button = (IButtonControl)control;
None.gif
None.gif                     if ((button.CausesValidation && ( this.Page.GetValidators(button.ValidationGroup).Count > 0)) || ! string.IsNullOrEmpty(button.PostBackUrl))
ExpandedBlockStart.gif ContractedBlock.gif                     dot.gif{
InBlock.gif                        strOnClickScript =  string.Format(gDoPostBackWithOptions, control.ClientID, button.CommandArgument, button.CausesValidation.ToString().ToLower(), button.ValidationGroup, button.PostBackUrl, "false", "true");
ExpandedBlockEnd.gif                    }
None.gif                     else
ExpandedBlockStart.gif ContractedBlock.gif                     dot.gif{
InBlock.gif                        strOnClickScript = Page.ClientScript.GetPostBackEventReference(control, button.CommandArgument);
ExpandedBlockEnd.gif                    }


     至此KMessageBox服务端的封装工作全部结束。做到,不影响原来的编码方式,只需要简单的执行一下KMessageBox的RegisterConfrim函数为control注册一下客户端事件就搞定一切。

分类: 1.首页原创精华.NET区123,JavaScript/CSS



本文转自浪子博客园博客,原文链接:http://www.cnblogs.com/walkingboy/archive/2006/08/14/PostBack_ClientScript.html,如需转载请自行联系原作者

目录
相关文章
|
12天前
|
前端开发 JavaScript
使用JavaScript实现复杂功能:构建一个自定义的拖拽功能
使用JavaScript实现复杂功能:构建一个自定义的拖拽功能
|
6月前
uniapp自定义过滤器filter.js
uniapp自定义过滤器filter.js
65 0
|
4月前
|
存储 设计模式 监控
如何构建自定义 Node.js 事件发射器
如何构建自定义 Node.js 事件发射器
491 2
|
11天前
|
JavaScript 前端开发 API
框架分析(3)-Vue.js
框架分析(3)-Vue.js
|
4月前
|
JavaScript 测试技术
【sgGoogleTranslate】自定义组件:基于Vue.js用谷歌Google Translate翻译插件实现网站多国语言开发
【sgGoogleTranslate】自定义组件:基于Vue.js用谷歌Google Translate翻译插件实现网站多国语言开发
|
1月前
|
监控 JavaScript 安全
监控内网电脑软件设计与实现:基于Node.js的服务器端架构分析
在当今信息技术高度发达的时代,监控内网电脑的需求日益增长。企业需要确保网络安全,个人用户也需要监控家庭网络以保护隐私和安全。本文将介绍一种基于Node.js的服务器端架构,用于设计和实现监控内网电脑软件。
99 0
|
6月前
|
JavaScript 数据安全/隐私保护 Python
JS逆向 -- 某视频vurl值的加密分析
JS逆向 -- 某视频vurl值的加密分析
82 0
|
2月前
|
机器学习/深度学习 自然语言处理 JavaScript
GEE机器学习——最大熵分类器案例分析(JavaScript和python代码)
GEE机器学习——最大熵分类器案例分析(JavaScript和python代码)
41 0
|
3月前
|
存储 JavaScript 前端开发
JavaScript 自定义对象 及 new()原理与实现 如何完整地手写实现new
JavaScript 自定义对象 及 new()原理与实现 如何完整地手写实现new
60 0
|
4月前
|
JavaScript 前端开发 C++
如何构建自定义 Node.js 事件发射器
如何构建自定义 Node.js 事件发射器
33 2