引入 Validform验证

<script type="text/javascript">
 
       //添加操作
       crrTrTdCkId=1; 
       function addIndexBtnClick(){  
        crrTrTdCkId=crrTrTdCkId+1
        crrTrTdCkIdStr="CkId"+crrTrTdCkId
        var insertTr=
        '<tr >'+     
        '<td align="center" ><input  type="checkbox" name="ck" id="'+crrTrTdCkIdStr+'"/></td>'+
     '<td >&nbsp;<input name="dxName"  type="text"  datatype="*1-50" style="width:120px" ><span class="Validform_checktip"></span><label class="Validform_label" style="display: none;">名称</label></td>'+
     '<td >&nbsp;<input name="dxgrade" type="text"   datatype="n1-2" style="width:40px" ><span class="Validform_checktip"></span><label class="Validform_label" style="display: none;">分数</label></td>'+
     '<td >&nbsp;<input name="remark"  type="text" datatype="*0-150" style="width:250px" ><span class="Validform_checktip"></span><label class="Validform_label" style="display: none;">备注</label></td>'+
     '</tr>'
        $("#addPosition").after(insertTr);
     $("#addPosition").remove();
     $("#"+crrTrTdCkIdStr).parent().parent().after('<input id="addPosition" type="hidden"/>')
       }
       //删除操作
       function delIndexBtnClick(){
        if($("input[name='ck']:checked").length==0){
           tip("至少选择一条进行删除操作");
        }else{
         $('input[name="ck"]:checked').each(function(){
             $(this).parent().parent().remove();
           });
        }             
       }
       //全选 全不选 jq操作
        $(function(){
          $("#dxBox").click(function(){          
              if($("#dxBox").val()==0){       
             $('input[name="ck"]').attr("checked","true");                         
             $("#dxBox").val("1")
              }else{           
             $('input[name="ck"]').removeAttr("checked");               
             $("#dxBox").val("0")
              }            
            });
        })
 
       </script>
      
 <style type="text/css">
.formtable1 td{ border:1px solid #ddd;height:38px}
</style>
 
 </head>
 <body style="overflow-x: hidden;">
  
 
     <div style="height:25px" class="datagrid-toolbar">  
    <a id="addColumnBtn1" class="easyui-linkbutton" data-options="iconCls:'icon-add'" onclick="addIndexBtnClick();" href="#">添加</a>
    <a id="delColumnBtn1" class="easyui-linkbutton" data-options="iconCls:'icon-remove'" onclick="delIndexBtnClick();" href="#">删除</a>  
    <%--<span style="color:#000000;font-size:16px">点选项明细</span>--%>
    </div>
  <table class="formtable1" cellpadding="0" cellspacing="0" width="100%" >
      <tr>      
         <td align="center" width="5%"  > <input type="checkbox" value="0" id="dxBox" /></td>
      <td align="center" width="30%" ><b>名称</b></td>
      <td align="center" width="15%" ><b>分数</b></td>
      <td align="center" width="50%" ><b>备注</b></td>   
   </tr>
   <c:forEach items="${dxList }" var="v1" varStatus="status">
     <tr>     
         <td align="center" valign="middle" >
         <input type="checkbox" name="ck" id="trForCK${status.index+1}"/>
         </td>
      <td>&nbsp;
      <input name="dxName" value="名称1" type="text"  datatype="*1-50" style="width:120px" >
      <span class="Validform_checktip"></span>
      <label class="Validform_label" style="display: none;">名称</label>
      </td>
      <td  >&nbsp;
      <input  name="dxgrade" value="1"  type="text"  datatype="n1-2" style="width:40px" >
      <span class="Validform_checktip"></span>
      <label class="Validform_label" style="display: none;">分数</label>
      </td>
      <td>&nbsp;
      <input name="remark"  value="备注1" type="text"  datatype="*0-150" style="width:250px">
      <span class="Validform_checktip"></span>
      <label class="Validform_label" style="display: none;">备注</label>
      </td>
   </tr>
   </c:forEach>
             <input id="addPosition" type="hidden"/>
  </table>

关于checkbox操作 table的更多相关文章

  1. jQuery操作Table tr td常用的方法

    虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...

  2. 汇总常用的jQuery操作Table tr td方法

    虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...

  3. JQuery操作Table元素

    使用Jquery操作Table中的tr向上或向下移动,以及全选和反选操作. 点击Table Head中的复选框,全选或反选表格中所有的复选框; 选中复选框,点击Up 按钮, tr上移;点击 Down ...

  4. js实现动态操作table

     本章案例为通过js,动态操作table,实现在单页面进行增删改查的操作. 简要案例如下: <%@ page language="java" contentType=&quo ...

  5. jQuery操作table数据上移、下移和置顶

    jQuery 操作table中的tr换行的步骤如下: 1.获取当前tr var $tr = $(this).parents("tr"); 2.移动tr //上移 $tr.prev( ...

  6. js 操作table: insertRow(),deleteRow(),insertCell(),deleteCell()方法

    表格有几行: var trCnt = table.rows.length;  (table为Id ) 每行有几列:for (var i=0; i<trCnt; i++)              ...

  7. 第十三篇 JS 操作table表格

    JS 操作table表格 这节课难度可能高一点,因为没有提前解释if判断.for循环.这节课是直接把这两样用上了,老师先简单介绍一下: if,判断语句,判断就很简单了嘛,假如说1=1(1等于1),当然 ...

  8. jQuery操作Table学习总结[转]

    <style type="text/css">       .hover       {                  }    </style>< ...

  9. 最近自己封装了个JS脚本,用来创建和操作Table

    基于JQuery封装的Table操作脚本 /** 依赖JQuery **/ (function () { var Table = window.Table = function (rowCount, ...

随机推荐

  1. Docker的主要组件

    Docker 的主要组件 安装 docker ,其实是安装了 docker 客户端.dockerd 等一系列的组件,其中比较重要的有下面几个. Docker CLI(docker)docker 程序是 ...

  2. PHP 循环删除无限分类子节点

    <?php private function _deleteSubNode($ids){ $subNodes = array(); $mod = D('Node'); foreach (expl ...

  3. Hadoop Map/Reduce的工作流

    问题描述 我们的数据分析平台是单一的Map/Reduce过程,由于半年来不断地增加需求,导致了问题已经不是那么地简单,特别是在Reduce阶段,一些大对象会常驻内存.因此越来越顶不住压力了,当前内存问 ...

  4. C++ cosnt的一点总结

    1,C++在定义函数重载的时候形参不管是不是const的他们都是等价的,除非形参是const引用.举个例子: void fun(int a){...}与void fun(const int a){.. ...

  5. MySQL 存储引擎、锁、调优、失误与事务回滚、与python交互、orm

    1.存储引擎(处理表的处理器) 1.基本操作 1.查看所有存储引擎 mysql> show engines; 2.查看已有表的存储引擎 mysql> show create table 表 ...

  6. JS回调函数(深入篇)

    <有些错别字> 在Javascript中,函数是第一类对象,这意味着函数可以像对象一样按照第一类管理被使用.既然函数实际上是对象:它们能被“存储”在变量中,能作为函数参数被传递,能在函数中 ...

  7. 01——微信小程序官方demo讲解——文件结构

    1.环境概览 首先环境配置的部分略过,打开小程序开发工具.选择一个空目录,即可开始一个demo项目. 其中新建成功后的目录如图所示: 2.文件结构描述 如图所示,左边是界面展示,右边是目录结构. 目录 ...

  8. 渗透辅助神器 - DZGEN

    项目地址:https://github.com/joker25000/DZGEN git clone ┌─[root@sch01ar]─[/sch01ar] └──╼ #git clone https ...

  9. Python模块学习 ---- datetime

    Python提供了多个内置模块用于操作日期时间,像calendar,time,datetime.time模块我在之前的文章已经有所介绍,它提供的接口与C标准库time.h基本一致.相比于time模块, ...

  10. 06_java之类概述

    01引用数据类型_类 * A: 数据类型 * a: java中的数据类型分为:基本类型和引用类型 * B: 引用类型的分类 * a: Java为我们提供好的类,比如说:Scanner,Random等. ...