获得jquery-datatables 选中的行的内容
来源:互联网 发布:网络电爱录音沈婷 编辑:程序博客网 时间:2024/06/07 18:56
我对于jQuery-datatables 已经是无力吐槽,如果你是自己接活,没有专业的前端,建议你还是选择其他的表格吧,如果你们公司正在用jQuery-datatables,在这里只能祝你好运了。当然了,这么说似乎有些偏激,不过作为一名不太研究前端的程序员,对一个让他通了几宵的一个前端框架有个抱怨也没啥。
按照面向对象的角度思考问题,获取选中行的内容理应该有个方法来支持,但是你想多了。用过easyUI的朋友可能在这里非常不适应。不知道我是该赞扬它简洁,美观。还是该批判它太过于简陋。既然对table进行了封装,那么就彻底一点好不好,很多地方想要实现一个功能,感觉似乎都在给jQuery-datatables擦屁股。
以获取选中行的内容来看,下面拼接了几段代码,
第一段大概就是一个HTML中使用了table
第二段是通过js将HTML中使用table渲染成为jQuery-datatables
第三段是tbody的点击事件,用来获取选中行的内容
下面是具体代码:
1、HTML中定义的表格
<table class="table table-border table-bordered table-bg table-hover table-sort"> <thead> <tr class="text-c"> <th></th> <th>ID</th> <th>图标名称</th> <th>图标样式</th> <th>图标值</th> <th>图标类型</th> </tr> </thead> <tbody onclick="getTableContent()"> <s:iterator value="#iconList" var="q"> <tr class="text-c"> <td><input type="checkbox" value="${q.id }" name="id"></td> <td>${q.id }</td> <td class="text-l"> <u style="cursor:pointer" class="text-primary" onClick="article_edit('授课列表','article-list.html','10001')" title="授课列表">${q.name }</u> </td> <td><i class="Hui-iconfont">&${q.value };</i></td> <td id="icon_val">${q.value }</td> <td>${q.type }</td> </tr> </s:iterator> </tbody> </table>
2、渲染一个table对象
var table = $('.table-sort').dataTable({ "aaSorting": [[ 1, "desc" ]],//默认第几个排序 "bStateSave": true,//状态保存 "aoColumnDefs": [ //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示 {"orderable":true,"aTargets":[1,5]}// 不参与排序的列 ]});
3、获得单机事件的行的内容
function getTableContent() { var nTrs = table.fnGetNodes();//fnGetNodes获取表格所有行,nTrs[i]表示第i行tr for ( var i = 0; i < nTrs.length; i++) { // if($(nTrs[i]).hasClass('selected')){//相当于$(tr) var t = table.fnGetData(nTrs[i]); alert(t[4]);//获取一行第4列数据 // } }}
阅读全文
1 0
- jquery-datatables 获得选中的行的内容
- 获得jquery-datatables 选中的行的内容
- JavaScript获得选中文本内容的方法
- jquery 获得选中的radio的值
- jQuery获得内容的高度
- jquery 获得select选中项的文本
- jquery 怎么获得checkboxList 选中的值
- jquery获得checkbox是否选中的状态
- jquery获得select选中的值
- jQuery中获得select选中的值
- jquery获得单选框选中的值
- JQuery如何获得所有选中的checkbox
- jQuery 的插件 dataTables
- jQuery dataTables 的使用
- jQuery dataTables 的使用
- jQuery dataTables 的使用
- jquery DataTables的使用
- jQuery dataTables 的使用
- forward和sendRedirect
- PHP常用的文件操作函数集锦
- Spark性能优化——RDD持久化
- 希尔排序
- 运用yield模拟协程
- 获得jquery-datatables 选中的行的内容
- CentOs 6 安装ruby
- 不得不知的颈椎病7大常见危害!__康立
- Java 8: Stream API 快速入门
- JNI Android Studio配置过程
- Eclipse发布maven项目JAR包依赖缺失
- HTML中Frameset标签的使用
- spring cloud 学习笔记
- 手机扫描身份证识别AND行驶证识别