一個form表單多個submit
在平時項目開發過程中，經常會遇到一個form表單對應多個submit提交的情況，那么 ，這種情況應該怎么解決呢，也很簡單，這時候就不能用submit來提交了，可以通過js的點擊事件來觸發提交
格式如下：
1 <form name="demo" method="post">
2 <!--YOUR DATA AREA-->
3 <input type="button" value="添加" onclick="addAction()">
4 <input type="button" value="刪除" onclick="deleteAction()">
5 <input type="button" value="保存" onclick="saveAction()">
6 <input type="button" value="查詢" onclick="searchAction()">
7 </form>
8
9 <script type="text/javascript">
10 function addAction(){ 11 document.demo.action="your add method url"; 12 document.demo.submit(); 13 } 14
15 function deleteAction(){ 16 document.demo.action="your delete method url"; 17 document.demo.submit(); 18 } 19
20 function saveAction(){ 21 document.demo.action="your add save url"; 22 document.demo.submit(); 23 } 24
25 function searchAction(){ 26 document.demo.action="your serach method url"; 27 document.demo.submit(); 28 } 29 </script>
特別提醒的是：form表單一定要添加上name屬性，以通過document定位訪問表單，不要寫action屬性了
實例如下：
摘自cmf后台的一段代碼
1 <include file="public@header" />
2 <include file="public@img" />
3 </head>
4 <body>
5 <div class="wrap">
6 <ul class="nav nav-tabs">
7 <li class="active"><a>評論管理</a></li>
8 </ul>
9 <form name="demo" method="post" action="{:url('Comment/index')}">
10 <div class="well form-inline margin-top-20">
11 是否顯示： 12 <select name="status" class="form-control">
13 <option value="2">請選擇...</option>
14 <foreach name="statuses" item="val" key="k">
15 <option value="{$k}" <if condition="$status eq $k">selected</if>>{$val}</option>
16 </foreach>
17 </select>
18 關鍵字： 19 <input type="text" class="form-control" name="keyword" style="width: 200px;"
20 value="{:input('request.keyword')}" placeholder="請輸入關鍵字...">
21 <input type="button" class="btn btn-primary" value="搜索" onclick="searchAction()"/>
22 <input type="hidden" name="is_order" id="order" value="0">
23 <a class="btn btn-danger" href="{:url('Comment/index')}">清空</a>
24 </div>
25 <!--</form>-->
26 <!--<form method="post" class="js-ajax-form" action="{:url('Comment/listOrder')}">-->
27 <div class="table-actions">
28 <button type="button" class="btn btn-primary btn-sm js-ajax-submit" onclick="orderAction()">{:lang('SORT')}</button>
29 </div>
30 <table class="table table-hover table-bordered table-list">
31 <thead>
32 <tr>
33 <th width="60">排序</th>
34 <th width="50">ID</th>
35 <th width="200">商品</th>
36 <th width="50">logo</th>
37 <th width="180">用戶</th>
38 <th width="50">頭像</th>
39 <th width="60">星級</th>
40 <th>評論內容</th>
41 <th width="140">評論時間</th>
42 <th width="80">狀態</th>
43 <th width="180">操作</th>
44 </tr>
45 </thead>
46 <tbody>
47 {$comment_tree} 48 </tbody>
49 </table>
50 <ul class="pagination">{$page|default=''}</ul>
51 </form>
52 </div>
53 <script src="__STATIC__/js/admin.js"></script>
54 <script>
55 function orderAction(){ 56 $('#order').val(1); 57 document.demo.action="{:url('Comment/index')}"; 58 document.demo.submit(); 59 }; 60 function searchAction(){ 61 document.demo.action="{:url('Comment/index')}"; 62 document.demo.submit(); 63 } 64 </script>
65 </body>
66 </html>
備注：在這里分兩次點擊事件進入同一方法，又在該方法中根據$order的值，來區分該次提交是來自哪個事件，因為業務邏輯都一樣，只不過排序操作增加一步更新排序的功能，所以把排序方法和搜索方法放在了一起