Asp.Net Form表单控件的回车默认事件
2017-09-01 14:20
405 查看
当form表单文本框控件在收到回车事件时,默认会触发表单内第一个可提交按钮的事件,但业务中可能要求有其它控件进行提交,而不是这个默认的
这时需要脚本控件事件冒泡传递取消回事事件.
在做ASP.net WEB应用的时候,常常遇到会在同一个页面里添加多个按钮,而每个按钮肯定都会触发页面回送事件。
在ASP.NET中,只能指定一个带有runat="server"的FORM表单,因此,这个表单会指派哪个按钮为默认提交按钮呢?
不做任何处理的情况下是很难控制的,例如在同一个页面里做了N个搜索框,设计上理想的思路是在某一输入框输入关键字后,用户按ENTER键,执行当前输入的输入框对应的提交按钮,但是,实际上往往事与愿违。无论怎么提交,总是会只执行某一个按钮事件。
如果指定Form的默认按钮,可以指定Form的DefaultButton属性值为一个按钮的ID。但这样下来,回车时就永远执行这个按钮,其它按钮无法被回车触发。
网上很多方法都是使用JAVASCRIPT来进行判断,在输入框中加入KEYPRESS之类的事件,然后检查eventCode,如果是回车键,那么就指定执行某一个按钮。
这个方法不是不行,但是,并不好维护,而且在处理复杂的逻辑时,往往不好控制。
其实,ASP.NET给出了很好的解决方案,只是通常不被人注意。
首先,屏蔽浏览器提交模式,也就是说,FORM不再默认指定一个ENTER提交的按钮
方法是将控件button的UseSubmitBehavior设置为false(LinkButton和ImageButton没有这个属性,不必设置),这样这个按钮就不会接受回车提交,这样就不会出现用户焦点在页面某处聚焦时按回车提交的情况。
为什么会这样呢?查看页面源文件我们会发现本来ASP.NET的BUTTON服务器控件在发送到客户端后type="submit",但这时UseSubmitBehavior设置为false后,type="button" ,而且多了一个onclick事件,内容是"javascript:__doPostBack('Button1','')" id="Button1",这样,就说明,这个按钮不再是FORM的提交按钮了,而只是一个普通按钮,要提交页面必须执行click事件,所以怎么点回车,也不会执行这个按钮的提交事件。
刚才只是第一步,阻止了默认的提交。但是,我们要的效果是回车可以提交啊。只是设置这一个属性当然无法达到我们想要的效果。
接下来,我们要了解Panel控件。
其实Panel控件是非常有用的,他是一个容器,在ASP.NET的Panel控件中有一个属性 DefaultButton, 这个属性在ASP.NET的Form控件中也有(前有叙述)。
Panel是一个特殊的控件 MSDN上的说明是:使用Panel 控件来组织 Form、另一 Panel 或模板中的内容和控件。
也就是说Panel是ASP.NET对Form的一个补充,可以给表单分区域的控件,这也是为什么ASP.NET AJAX容器使用该控件的原因。
我们都知道,ASPX只能有一个runat=“server”的FORM表单,那么要进行细致,具体的FORM操作怎么办,那么就得靠Panel控件
这里,我们就会用到Panel的这个功能
将一组输入框和按钮放在一个Panel中,指定该Panel的DefaultButton属性为按钮ID,这样,当用户焦点处于这个Panel内的某一控件时,点击回车就会执行这个Panel的DefaultButton所指定的按钮。
Panel是Form的补充控制,可以通过使用Panel对表单进行更多的操作,这样,ASP.NET只能拥有一个Form所引起的一些困难都可以迎刃而解。
原文 http://blog.sina.com.cn/s/blog_568e662301018n2i.html
这时需要脚本控件事件冒泡传递取消回事事件.
$(document).keydown(keyListener); function keyListener(e) { e = e ? e : event; try { if (e.keyCode == 13) { if (e.preventDefault) { e.preventDefault(); e.stopPropagation(); } else { window.event.returnValue = false; } } } catch (ex) { } }
document.onkeydown = keyListener; function keyListener(e) { e = e ? e : event; if (e.keyCode == 13) { if (document.activeElement.id == '<%=this.txtBarCode.ClientID%>') { event.preventDefault(); e.stopPropagation(); $("#<%=this.btnQuery.ClientID%>").click(); } else if (document.activeElement.id == '<%=this.txtGoodID.ClientID%>' || document.activeElement.id == '<%=this.txtSize.ClientID%>') { e.preventDefault(); e.stopPropagation(); var huohao = $('#<%=this.txtGoodID.ClientID%>').val(); var chima = $('#<%=this.txtSize.ClientID%>').val(); if (huohao != null && huohao != '' && chima != null && chima != '') { <%=this.ClientScript.GetPostBackEventReference(this.btnQuery, "")%>; } } } }
ASP.NET多个提交按钮页面,回车Enter执行指定按钮的事件(转)
在WEB页面上,通常SUBMIT类型的按钮会被默认指派为所在FORM表单的提交按钮在做ASP.net WEB应用的时候,常常遇到会在同一个页面里添加多个按钮,而每个按钮肯定都会触发页面回送事件。
在ASP.NET中,只能指定一个带有runat="server"的FORM表单,因此,这个表单会指派哪个按钮为默认提交按钮呢?
不做任何处理的情况下是很难控制的,例如在同一个页面里做了N个搜索框,设计上理想的思路是在某一输入框输入关键字后,用户按ENTER键,执行当前输入的输入框对应的提交按钮,但是,实际上往往事与愿违。无论怎么提交,总是会只执行某一个按钮事件。
如果指定Form的默认按钮,可以指定Form的DefaultButton属性值为一个按钮的ID。但这样下来,回车时就永远执行这个按钮,其它按钮无法被回车触发。
网上很多方法都是使用JAVASCRIPT来进行判断,在输入框中加入KEYPRESS之类的事件,然后检查eventCode,如果是回车键,那么就指定执行某一个按钮。
这个方法不是不行,但是,并不好维护,而且在处理复杂的逻辑时,往往不好控制。
其实,ASP.NET给出了很好的解决方案,只是通常不被人注意。
首先,屏蔽浏览器提交模式,也就是说,FORM不再默认指定一个ENTER提交的按钮
方法是将控件button的UseSubmitBehavior设置为false(LinkButton和ImageButton没有这个属性,不必设置),这样这个按钮就不会接受回车提交,这样就不会出现用户焦点在页面某处聚焦时按回车提交的情况。
为什么会这样呢?查看页面源文件我们会发现本来ASP.NET的BUTTON服务器控件在发送到客户端后type="submit",但这时UseSubmitBehavior设置为false后,type="button" ,而且多了一个onclick事件,内容是"javascript:__doPostBack('Button1','')" id="Button1",这样,就说明,这个按钮不再是FORM的提交按钮了,而只是一个普通按钮,要提交页面必须执行click事件,所以怎么点回车,也不会执行这个按钮的提交事件。
刚才只是第一步,阻止了默认的提交。但是,我们要的效果是回车可以提交啊。只是设置这一个属性当然无法达到我们想要的效果。
接下来,我们要了解Panel控件。
其实Panel控件是非常有用的,他是一个容器,在ASP.NET的Panel控件中有一个属性 DefaultButton, 这个属性在ASP.NET的Form控件中也有(前有叙述)。
Panel是一个特殊的控件 MSDN上的说明是:使用Panel 控件来组织 Form、另一 Panel 或模板中的内容和控件。
也就是说Panel是ASP.NET对Form的一个补充,可以给表单分区域的控件,这也是为什么ASP.NET AJAX容器使用该控件的原因。
我们都知道,ASPX只能有一个runat=“server”的FORM表单,那么要进行细致,具体的FORM操作怎么办,那么就得靠Panel控件
这里,我们就会用到Panel的这个功能
将一组输入框和按钮放在一个Panel中,指定该Panel的DefaultButton属性为按钮ID,这样,当用户焦点处于这个Panel内的某一控件时,点击回车就会执行这个Panel的DefaultButton所指定的按钮。
Panel是Form的补充控制,可以通过使用Panel对表单进行更多的操作,这样,ASP.NET只能拥有一个Form所引起的一些困难都可以迎刃而解。
原文 http://blog.sina.com.cn/s/blog_568e662301018n2i.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK"> <title>submit例子 - aspxhome.com</title> </head> <body> <h1>本demo演示在文本框中按enter键是否触发提交表单</h1> <h2>默认情况下,一个文本框的时候,提交,不管按钮type是submit还是button</h2> <form action="http://www.csdn.net"> <input type="text"> <input type="button" value="提交"> </form> <h2>一个文本框的时候怎么才能做到不提交,方法是加一个隐藏掉的文本框</h2> <form action="http://www.csdn.net"> <input type="text"> <input type="text" style="display:none"> <input type="button" value="提交"> </form> <h2>只要有type为submit的按钮存在,一个文本框还是多个文本框都提交</h2> <form action="http://www.csdn.net"> <input type="text"> <input type="submit" value="提交"> </form> <h2>只要有type为submit的按钮存在,一个文本框还是多个文本框都提交</h2> <form action="http://www.csdn.net"> <input type="text"> <input type="text"> <input type="submit" value="提交"> </form> <h2>多个文本框的时候,不提交,用type为button的按钮就行啦</h2> <form action="http://www.csdn.net"> <input type="text"> <input type="text"> <input type="button" value="提交"> </form> <h2>用button元素时,FX和IE下有不同的表现</h2> <form action="http://www.csdn.net"> <input type="text"> <input type="text"> <button>提交</button> </form> <h2>radio和checkbox在FX下也会触发提交表单,在IE下不会</h2> <form action="http://www.csdn.net"> <input type="text"> <input type="radio" name="a"> <input type="checkbox" name="b"> <input type="checkbox" name="c"> <input type="button" value="提交"> </form> <h2>type为image的按钮,等同于type为submit的效果</h2> <form action="http://www.csdn.net"> <input type="text"> <input type="text"> <input type="image" src="/images/logo.gif"> </form> </body> </html>
相关文章推荐
- 不使用ASP.NET服务器端控件(包括form表单不加runat="server")来触发.cs里的事件(方法),(适用于有代码洁癖者)。
- asp.net页面的默认回车事件
- Asp.net回车默认按钮事件解决方案
- asp.NET去掉form的runat="server"照样使用服务器控件,包括表单的服务器控件
- ASP.NET多个用户控件回车提交表单问题
- asp.net 控件按回车执行click事件
- 基于 猫冬的 jQuery formValidator表单验证 的asp.net 控件
- ASP.NET多个用户控件回车提交表单问题解决和获取用户控件上的ID方法
- 设置页面的默认焦点控件和默认接受事件控件How Do I Set the DefaultFocus or DefaultButton in a Page Based on a Master Page in ASP.NET 2.0
- 【ZT】asp.NET去掉form的runat="server"照样使用服务器控件,包括表单的服务器控件
- 关于form表单中禁用所有Asp.net 服务器控件TextBox的方法
- Asp.net回车默认按钮事件解决方案
- ASP.Net 的按钮事件中显示ASPxPopupControl,控件显示不出来
- Visual Studio 2005入门 之 Asp.Net中的事件(控件事件) [视频]
- 《Programming ASP.NET》学习笔记(FormView控件)
- form表单回车提交问题,JS监听回车事件
- ASP.NET 安全认证(一)—— 如何运用 Form 表单认证 .(转)
- ASP.NET 安全认证(二)——灵活运用 Form 表单认证中的 deny 与 allow 及保护 .htm 等文件 .
- ASP.NET 入手页面控件及事件触发
- asp.net 回车激发指定按钮事件