操作dom获取datatable中的某一行的某一列的数据
需求描述:编辑的时候,点击的那一行,进入后台的验证方法,验证通过后,再进入编辑页面,进入的时候需要把本行<tr>数据中的某一列<td>的值传递过去
思路表述:之前我想的是,给列表每一个tr里都放如一个input隐藏域,值就是需要传递的,后台直接通过 $("# id").val( )获取,后来想想,虽然这么做也可以但是违背了规范“尽量减少标签”,于是就想对datatable做直接的操作,获取数据。
代码:
//html代码
<table id=table1>
<tr th:each="pac : ${list}" th:id="${pac.pacId}"
th:attr="data-pac-name=${pac.pacName},data-pac-code=${pac.pacCode}"
class="trs">
//id是行id 也是该行数据的uuid th:onclick="|editById('${pac.pacId}')|"
// th:attr="data-pac-name=${pac.pacName},data-pac-code=${pac.pacCode}"把需要的数据放到<tr>中 js中可以通过 .data('属性名')获取到这个值
<td th:text="${pac.pacName}">名称</td>
<td th:text="${pac.pacCode}">编码</td>
</tr>
</table> //js代码
<script type="text/javascript" th:inline="javascript" xmlns:th="http://www.w3.org/1999/xhtml">
function check(id){
//获取table1的datatable对应行id的节点
var nodes = $('#table1').DataTable().row('#' + id).nodes();
var pacName= $(nodes[0]).data('pacName');
var pacCode= $(nodes[0]).data('pacCode');
// nodes[0]表示当前行 和list.get(0)作用类似 data()方法来取值
// data('pacCode')中的pacCode是和th:attr="data-pac-code=${pac.pacCode}"的 data-pac-code对应,H5新特性,取值的时候会自动还原为data-pacCode,表示data下的属性pacCode
}
/*pacName和pacCode拼到进入后台方法的url中 该部分代码省略*/
</script>
总结:操作dom真的可以帮助我们节省很多资源,不过在调试的时候,只有获取到前一个对象节点的时候,后边才能取到值,调试挺废时间的。datatable操作dom还有很多零碎的知识点,但是在开发中会经常用到,仍需不断地总结。
操作dom获取datatable中的某一行的某一列的数据的更多相关文章
- 【转载】C#如何获取DataTable中某列的数据类型
在C#的数据表格DataTable的操作中,有时候因为业务需要,我们需要获取到DataTable所有列或者某一列的数据类型,此时我们可以通过DataTable中的Columns属性对象的DataTyp ...
- 【转载】C#手动往DataTable中末尾新增一行数据
在C#中的Datatable数据变量的操作过程中,需要手动往DataTable变量的末尾新增一行数据,例如一个实际的例子,我们做数据报表,在最后一行可能需要新增一行DataRow数据作为一个汇总记录, ...
- NPOI操作Excel导入DataTable中
using NPOI.HSSF.UserModel; using NPOI.SS.UserModel; using System.Data; using System.IO; using NPOI.X ...
- 如何用python获取文件中的某一行——python小技巧
很多人有的时候只需要获取文章中的固定的一行,那么我知道这一行,我需要怎么样去获取呢 可能会有人说读取这一行,如果这一行是已什么开头的就读出来, 其实还有一种办法,就是我知道文件的路径.知道我要取的行数 ...
- 获取redis中所有的key,清空整个 Redis 服务器的数据
获取 redis 中所有的 key 可用使用 *. redis 127.0.0.1:6379> KEYS * Redis Flushall 命令用于清空整个 Redis 服务器的数据(删除所有数 ...
- 如何删除datatable中的一行数据
在C#中,如果要删除DataTable中的某一行,大约有以下几种办法: 1,使用DataTable.Rows.Remove(DataRow),或者DataTable.Rows.RemoveAt(ind ...
- 【转载】C#通过IndexOf方法获取某一列在DataTable中的索引位置
在C#中的Datatable数据变量的操作过程中,有时候需要知道某一个列名在DataTable中的索引位置信息,此时可以通过DataTable变量的Columns属性来获取到所有的列信息,然后通过Co ...
- jQuery权威指南(第2版) 学习一 jQuery操作DOM
jQuery操作DOM 获取元素的属性 attr(name) 获取元素属性的语法格式如下: attr(name) 其中,参数 name 表示属性的名称. 例子: <img alt="& ...
- C# 对DataTable中按条件进行筛选和更新。
当我们频繁的对数据库进行操作时,可能造成CPU使用率过高,这时我们可以先将数据表读取到DataTable,然后在必要的时候再更新到数据库中. 以下是DataTable中对数据的选择和更新操作.采用Da ...
随机推荐
- KeyUp 和KeyDown 、KeyPress之间的区别
keydown:用户在键盘上按下某按键是发生.一直按着某按键则会不断触发(opera浏览器除外). keypress:用户按下一个按键,并产生一个字符时发生(也就是类似shift.alt.ctrl之类 ...
- 基于【字节】操作的IO接口:InputStream、OutputStream
InputStream 参考链接:对java中FileInputStream.BufferInputStream的理解 /** * Author:Mr.X * Date:2017/10/9 17:11 ...
- 【深入分析Java Web技术内幕】1、深入Web请求过程知识点
如何发起一个请求 发起一盒HTTP请求的过程就是建立一个Socket通信的过程! 既然发起一个HTTP的本质就是建立一个Socket连接,那么我们完全可以模拟浏览器来发起HTTP请求,这很好实现,如H ...
- 《Java编程思想第四版》附录 C Java 编程规则
附录 C Java 编程规则 本附录包含了大量有用的建议,帮助大家进行低级程序设计,并提供了代码编写的一般性指导: (1) 类名首字母应该大写.字段.方法以及对象(句柄)的首字母应小写.对于所有标识符 ...
- Springboot配置时间格式
方法一: 可以在apllication.property加入下面配置就可以 #时间戳统一转换 spring.jackson.date-format=yyyy-MM-dd HH:mm:ss spring ...
- setValuesForKeysWithDictionary:的用途
setValuesForKeysWithDictionary :今天发现这个高大上的功能,让我心奋不已,以后妈妈再也不用担心模型属性多了,再也不用担心将字典中的值赋值到模型中的麻烦操作了. 模型的.h ...
- 【Linux-Redhat】新手需要知道的Linux命令
好像接触运维有一年的时间了吧,查的资料什么的,也算是挺多的了.再加上最近看的<Linux就该这么学>,也算是把自己最近学的东西系统化了一下.今天就来说说,常用的Linux命令有什么,如果你 ...
- 【原理】VRRP详解
写在前面 keepalived是一个基于VRRP协议来实现的服务高可用方案,从而可以避免IP单点故障.一般与其他负载均衡技术,如LVS,Nginx等一起来工作来达到集群高可用的目的 关于Keepali ...
- Segmentation metrics
(1)FCN中引入的四种Metrics:
- Windows PowerShell 入門(3)-スクリプト編
これまでの記事 Windows PowerShell 入門(1)-基本操作編 Windows PowerShell 入門(2)-基本操作編 2 対象読者 Windows PowerShellでコマンド ...