[总结]实现表格中对checkbox的操作

最新推荐文章于 2020-12-28 21:40:45 发布

转载最新推荐文章于 2020-12-28 21:40:45 发布 · 500 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/scnulyp/p/6533371.html

文章标签：

#java #前端 #测试 #ViewUI

本文介绍如何使用Java处理HTML表单中的复选框数据，包括使用getParameterValues获取多个值及参数处理技巧。同时展示了如何利用JavaScript和jQuery进行前端操作。

request.getParameterValues(String name)是获得如checkbox类（名字相同，但值有多个的数据。接收数组变量，如checkobx类型
request.getParameter（String name）是获得相应名的数据，如果有重复的名，则返回第一个的值 . 接收一般变量，如text类型

html代码如下：

<tr>
    <td><input type="checkbox" name="conditions" value="<%=list.get(i).getI_id() %>" id="checkbox+<%=i%>"/>                     
    </td>
    <td><%=list.get(i).getName()%></td>
    <td><%=list.get(i).getMoblie()%></td>
    <td><%=list.get(i).getAddress()%></td>
    <td><%=list.get(i).getMail()%></td>
    <td>
      <a            href="javascript:doUpdate('<%=list.get(i).getI_id()%>','<%=list.get(i).getName()%>','<%=list.get(i).getMoblie()%>','<%=list.get(i).getAddress()%>','<%=list.get(i).getMail()%>')">修改&nbsp&nbsp</a>
     <a href="javascript:doDelete('<%=list.get(i).getI_id()%>')">&nbsp&nbsp删除</a></td>
</tr>

注意到，checkbox的name都是一致的，value则是我从后端查回来的id，id是name和value的组装

Js代码如下：

function check(){
     $("document").ready(function(){
         var myTable =  document.getElementById("myTable");
         for(var i=0;i<myTable.rows.length;i++){
             if($("input[id='checkbox+"+i+"']").is(":checked")){
               //判断checkbox是否被选中
                 $("input[id='checkbox+"+i+"']").attr('name','checked');
                //将被选中的checkbox的name改掉
             }
         }      
     });
     $("#export-form").submit();
}

同时附上JQuery判断checkbox的一系列方法

$("[name='checkbox']").attr("checked",'true');//全选
$("[name='checkbox']").removeAttr("checked");//取消全选
$("[name='checkbox']:even").attr("checked",'true');//选中所有奇数

注意js中字符串的拼接，单引号''双引号的使用""，这个真是坑了我

服务端（java）的代码如下

String[] str = request.getParameterValues("checked");
List<addressbookfunctionVO> list_ = abf.searchById(str);
return list_;

转载于:https://www.cnblogs.com/scnulyp/p/6533371.html