• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

ASP.NET多个提交按钮页面,ENTER指定执行某一按钮

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

在WEB页面上,通常SUBMIT类型的按钮会被默认指派为所在FORM表单的提交按钮

 

我们在做ASP.net WEB应用的时候,常常遇到会在同一个页面里添加多个按钮,而每个按钮肯定都会触发页面回送事件。

在ASP.NET中,只能指定一个带有RUNAT=SERVER的FORM表单,因此,这个表单会指派哪个按钮为默认提交按钮呢?

不做任何处理的情况下是很难控制的,例如在同一个页面里做了N个搜索框,设计上理想的思路是在某一输入框输入关键字后,用户按ENTER键,执行当前输入的输入框对应的提交按钮,但是,实际上往往事与愿违。无论怎么提交,总是会只执行某一个按钮事件。

 

网上很多方法都是使用JAVASCRIPT来进行判断,在输入框中加入KEYPRESS之类的事件,然后检查eventCode,如果是回车键,那么就指定执行某一个按钮。

这个方法不是不行,但是,并不好维护,而且在处理复杂的逻辑时,往往不好控制。

 

其实,ASP.NET给出了很好的解决方案,只是通常不被人注意。

首先,屏蔽浏览器提交模式,也就是说,FORM不再默认指定一个ENTER提交的按钮

 

方法是将BUTTON的UseSubmitBehavior设置为false,这样这个按钮就不会接受回车提交,这样就不会出现用户焦点在页面某处聚焦时按回车提交的情况。

为什么会这样呢?查看页面源文件我们会发现本来ASP.NET的BUTTON服务器控件在发送到客户端后type="submit",但这时UseSubmitBehavior设置为false后,type="button" ,而且多了一个onclick事件,内容是"javascript:__doPostBack('Button1','')" ,这样,就说明,这个按钮不再是FORM的提交按钮了,而只是一个普通按钮,要提交页面必须执行click事件,所以怎么点回车,也不会执行这个按钮的提交事件。

 

刚才只是第一步,阻止了默认的提交。但是,我们要的效果是回车可以提交啊。只是设置这一个属性当然无法达到我们想要的效果。

接下来,我们要了解Panel控件。

其实Panel控件是非常有用的,他是一个容器,在ASP.NET的Panel控件中有一个属性 DefaultButton 这个属性在ASP.NET的FROM控件中也有。

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所引起的一些困难都可以迎刃而解。

 

实例代码就不具体写了,毕竟只是设置一下控件属性,并不困难,只是大部分人没有注意到这个问题。

 

 

<asp:Panel ID="SearchPanel" DefaultButton="SearchSubmit" runat="server">

    

    <asp:TextBox ID="Key" MaxLength="30" Width="300px" runat="server"></asp:TextBox>

               

    <asp:Button ID="SearchSubmit" CssClass="btn" runat="server" Text="  搜索  " CausesValidation="False" onclick="SearchSubmit_Click" UseSubmitBehavior="false"/>

 

</asp:Panel>

 

 

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
ASP.NET琐碎(ZZ&amp;summary)发布时间:2022-07-10
下一篇:
关于asp.netmvc中的httpModules与httpHandler发布时间:2022-07-10
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap