今天学了
Form表单中不同的按钮进行不同的跳转
本文参考:http://my.oschina.net/sallency/blog/300568
在开发工作共我们往往会遇到一个表单需要包含多个action不同的提交动作,这时候就不能在使用submit按钮来进行提交了,下面提供通过js来实现这一功能的方法.
示例代码:
<form name="demo" method="post">
<!--YOUR DATA AREA-->
<input type="button" value="添加" onclick="addAction()">
<input type="button" value="删除" onclick="deleteAction()">
<input type="button" value="保存" onclick="saveAction()">
<input type="button" value="查询" onclick="searchAction()">
</form>
<script type="text/javascript">
function addAction(){
document.demo.action="your add method url";
document.demo.submit();
}
function deleteAction(){
document.demo.action="your delete method url";
document.demo.submit();
}
function saveAction(){
document.demo.action="your add save url";
document.demo.submit();
}
function searchAction(){
document.demo.action="your serach method url";
document.demo.submit();
}
</script>
//==================
demo中的代码(JSP中的hidden):
1 <%@ page language="java" contentType="text/html; charset=UTF-8"
2 pageEncoding="UTF-8"%>
3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
4 <html>
5 <head>
6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
7 <title>Insert title here</title>
8 <script type="text/javascript">
9 function trimStr(str){
10 return str.replace(/(^\s*)|(\s*$)/g,"");
11 }
12 function redisSearchSubmit(){
13 document.getElementById("searchtype").value = "Redis查询";
14 document.form1.submit();
15 }
16
17 function jdbcSearchSubmit(){
18 document.getElementById("searchtype").value = "JDBC查询Mysql";
19 document.form1.submit();
20 }
21
22 function hibernateSearchSubmit(){
23 document.getElementById("searchtype").value = "Hibernate查询Mysql";
24 document.form1.submit();
25 }
26 function check(){
27
28 // 节目名
29 var assetname = document.form1.assetname.value;
30 if(trimStr(assetname) == ""){
31 alert("您输入的节目名是空格,请重新输入");
32 return false;
33 }
34
35 // 导演
36 var director = document.form1.director.value;
37
38 // 编剧
39 var screenwriter = document.form1.screenwriter.value;
40
41 //主演
42 var actor = document.form1.actor.value;
43 }
44
45 </script>
46 </head>
47 <body>
48 <h1>查询页面</h1>
49 <FORM name="form1" METHOD=POST ACTION="${ pageContext.request.contextPath }/redisSqlSearch" onsubmit="return check();">
50 <input type="hidden" name="searchtype" id="searchtype" value="" />
51 <TABLE border="1" width="500">
52 <TR>
53 <TD>节目名称</TD>
54 <TD><INPUT TYPE="text" NAME="assetname" value=""></TD>
55 </TR>
56 <TR>
57 <TD>导演</TD>
58 <TD><INPUT TYPE="text" NAME="director" value="冯小刚"></TD>
59 </TR>
60 <TR>
61 <TD>编剧</TD>
62 <TD><INPUT TYPE="text" NAME="screenwriter" value="顾晓阳"></TD>
63 </TR>
64 <TR>
65 <TD>主演</TD>
66 <TD><INPUT TYPE="text" NAME="actor" value="葛优"></TD>
67 </TR>
68 <TR>
69 <TD colspan="2">
70 <INPUT TYPE="button" value="Redis查询" onclick="redisSearchSubmit()">
71
72 <INPUT TYPE="button" value="JDBC查询Mysql" onclick="jdbcSearchSubmit()">
73
74 <INPUT TYPE="button" value="Hibernate查询Mysql" onclick="hibernateSearchSubmit()">
75 </TD>
76 </TR>
77 </TABLE>
78 </FORM>
79 </body>
80 </html>
浙公网安备 33010602011771号