关于表单回车自动提交的讨论

时间:2022-05-11 18:33:35

关于表单回车自动提交的讨论

 

     在做超限查询时,为了用户操作的易用性,在用户输入车牌号码后,直接回车就进行查询的操作,而不是等用户用鼠标点击“查询”了才发送请求去查询。可能我们都以为很简单,就是“查询”的时候(回车)去做发个查询的请求就行了,确定是如此。可是,如果只有一个用户输入车牌号码的表单text时,就会有些问题。

     我们的查询操作是发送一个ajax请求,而不是把表单提交上去,但是奇怪的是,只要一按回车键,表单就自动提交了,并没有去执行我希望执行的发送ajax请求。

查了资料,才知道:当在一个form中只有一个text元素,这时候如果按回车相当于对form进行了一个submit操作,所以用户在输入完按回车就代表了submit。如果一个form中不是只有一个text元素,而还有其它的text元素的话,就不会自动提交了。

     我解决并测试的过程,在程序中用户输入的车牌号的text的如下:

     <input type="text" name="LICENSE_CODE" size="10" onkeydown="if(event.keyCode==13){overLimitRecMgr.querySpecial();}"/>

     这时候一直没有执行overLimitRecMgr.querySpecial(),而是执行form的submit操作了,可以用setTimeout来测试,如下:

     if(event.keyCode==13){window.setTimeout('overLimitRecMgr.querySpecial()',500);return false;}

     这时候在执行完表单的自动提交后,延迟了0.5秒后再执行了ajax的请求:overLimitRecMgr.querySpecial()。

     其实最好的解决办法是:

     先让form不自动提交,然后在keydown==13时做自己想做的事,如发送ajax的请求等。如下处理:

     <form action="/jsp/over_mgr/over_limit_record/queryAllList.do" method="post" onSubmit="return false;">

     通过在from中设置onSubmit="return false;"就可以屏避了表单自动提交的问题。

----------------------------------------the end---------------------------------------