获取jQuery DataTables 的checked选中行
$(function () {
var tabel = $('#userlist').DataTable({
destroy: true, //Cannot reinitialise DataTable,解决重新加载表格内容问题
bProcessing: true, //DataTables载入数据时,是否显示‘进度’提示
bStateSave: false, //是否打开客户端状态记录功能,此功能在ajax刷新纪录的时候不会将个性化设定回复为初始化状态
aLengthMenu: [10, 20, 40, 60, 100, 1000], //更改显示记录数选项
iDisplayLength: 10, //默认显示的记录数
bInfo: true, //是否显示页脚信息,DataTables插件左下角显示记录数
bPaginate: true, //是否显示(应用)分页器
autoWidth: true, //是否自适应宽度
bScrollCollapse: true, //是否开启DataTables的高度自适应,当数据条数不够分页数据条数的时候,插件高度是否随数据条数而改变
sPaginationType: "full_numbers", //详细分页组,可以支持直接跳转到某页
bSort: false, //是否启动各个字段的排序功能
bFilter: true, //是否启动过滤、搜索功能
bServerSide: true, //开启此模式后,你对datatables的每个操作 每页显示多少条记录、下一页、上一页、排序(表头)、搜索,这些都会传给服务器相应的值。
"ajax": {
url: "/Ajax/UserMgrAjax.ashx?cmd=userList",
type: "POST"
},
columns: [
{
"sWidth": "4%",
"sClass": "text-center",
"data": null,
"targets": 0
},
{
"sWidth": "4%",
"sClass": "text-center",
"data": "u_id",
"render": function (data, type, full, meta) {//这里就是要显示的checkbox多选框了
return '<input type="checkbox" class="checkchild" value="' + data + '" />';
},
"bSortable": false
},
{ "sClass": "text-center", "data": "u_name" },
{ "sClass": "text-center", "data": "u_tel" },
{
"sClass": "text-center",
"data": "u_sex",
"render": function (data, type, row, meta) {
var content = "保密";
if (data == "1")
content = "男";
if (data == "2")
content = "女";
return content;
}
},
{ "sClass": "text-center", "data": "u_age" },
{ "sClass": "text-center", "data": "u_registerdate" },
{
"sClass": "text-center",
"data": "u_state",
"render": function (data, type, row, meta) {
var content = "非正常";
if (data == "0")
content = "正常";
if (data == "1")
content = "锁定";
return content;
}
},
{
"sClass": "text-center",
"data": "u_registerdate",
render: function (data, type, row, meta) {
return "<a id='edit' title='编辑' class='glyphicon glyphicon-edit nounderline' href='javascript:Edit("+row.u_id+");'></a>";
}
}
],
//这个应该是重绘的回调函数
fnDrawCallback: function () {
var startIndex = this.api().context[0]._iDisplayStart;//获取到本页开始的条数
this.api().column(0).nodes().each(function (cell, i) {
//翻页序号连续
cell.innerHTML = startIndex + i + 1;
});
},
});
//------------------------------------------------------------------------------------------------------------------------------------------
//删除
$("#del").click(function () {
var ids = "";
$('.checkchild').each(function () {
if ($(this).is(':checked')) {
ids += $(this).val()+",";
}
});
if (ids != "") {
$.ajax({
type: "Post",
url: "UserList.aspx/DelUser",
//方法传参的写法一定要对,str为形参的名字
data: "{'ids':'" + ids + "' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
//返回的数据用data.d获取内容
UserList();
layer.msg(data.d);
}
});
} else {
layer.msg("请选择行",{offset: ['300px', '700px']});
return;
}
});
});
获取jQuery DataTables 的checked选中行的更多相关文章
- 获取DataGridView中的的选中行
1. 获取DataGridView中的的选中行:http://blog.csdn.net/yiqijinbu/article/details/7734593 2.winform datagridvie ...
- jQuery DataTables 获取选中行数据
如题 想获取操作 DataTables 获取选中行数据 案1.主要是利用 js getElementsByTagName 函数 然后对获取到的tr 进行操作 如下 function getChec ...
- Jquery+CSS在不使用Checked的情况下实现当前选中行样式变化
之前在做一个当前选中行样式变化时发现网上很多方法都是利用在行内添加checked,然后通过checked是否选中来判断当前选中行的位置,今天就整理了一个不需要在行内添加其他按钮直接通过变化当前选中行的 ...
- JQuery EasyUI DataGrid获取当前行或选中行
1.获取当前选中行,如果没有选中行,则返回 null var row = $('#gridID').datagrid('getSelected'); 2.获取当前所有选中行数据,返回元素记录的数组数据 ...
- jquery获取table指定行和列的数据(当前选中行、列)
//不多说,直接上代码.$("table tr").click(function() {//为表格的行添加点击事件 var tr = $(this);//找到tr原色 var td ...
- 如何用jQuery获取选中行固定列的数据
[本文出自天外归云的博客园] 问题:把选中行的ID统计出来,组成一个数组传给后台(选中行的特点:class为danger) 办法如下: // 多选后点击下线按钮 $("#offline&qu ...
- Jquery DataTables 获取表格数据及行数据
注意table变量是 1.jQuery DataTables 行号获取 $("#example tbody tr").on("click", function( ...
- EasyUi DataGrid 获取选中行的checkbox
EasyUi DataGrid 获取选中行的checkbox var checked = $(":checkbox[name=ID]:checked"); console.log( ...
- jQuery获取单选框(复选框)选中的状态
jQuery 获取单选框(复选框)选中的状态 <input type="checkbox" name="" id="choose"/& ...
随机推荐
- ASP.NET中Literal控件的使用方法(用于向网页中动态添加内容)
原文:https://www.jb51.net/article/82855.htm 可以将 Literal 控件用作网页上其他内容的容器.Literal 控件最常用于向网页中动态添加内容.简单的讲,就 ...
- Js中className的用法
className可以用来改变标签元素的css类选择器,从而改变元素的样式 举个栗子 一个简单的无序列表,点击button之前ul的样式为uhh1 点击button后,调用check函数中的class ...
- Latex--入门系列三
Latex 专业的参考 tex对于论文写作或者其他的一些需要排版的写作来说,还是非常有意义的.我在网上看到这个对于Latex的入门介绍还是比较全面的,Arbitrary reference .所以将会 ...
- [小试牛刀]部署在IDEA的JFinal 3.0 demo
进入JFinal 极速开发市区:http://www.jfinal.com/ 如上图,点击右边的最新下载:JFinal 3.0 demo - 此过程跳过注册\登录过程, 进入到如下,下载 下载并解压到 ...
- 2-基于6U VPX的双TMS320C6678+Xilinx FPGA K7 XC7K420T的图像信号处理板
基于6U VPX的双TMS320C6678+Xilinx FPGA K7 XC7K420T的图像信号处理板 综合图像处理硬件平台包括图像信号处理板2块,视频处理板1块,主控板1块,电源板1块,VPX背 ...
- 修改pom项目版本 jenkins 关联 shell命令
#获取pom文件内的项目版本 version=`awk '/<version>[^<]+<\/version>/{gsub(/<version>|<\/ ...
- Integer类的缓存机制
一.Integer类的缓存机制 我们查看Integer的源码,就会发现里面有个静态内部类. public static Integer valueOf(int i) { assert IntegerC ...
- k8s+jenkins
1 server 的port , targetport, nodeport的区别 targetport为容器的暴露端口,为最后端的端口 port可以理解为pod的端口,pod是容器的外层,该端口可以在 ...
- vuex的mapState方法来获取vuex的state对象中属性
有两种写法 1.首先在组件中引入vuex的mapState方法: 首先在组件中引入vuex的mapState方法: import { mapState } from 'vuex' 然后在compute ...
- 04 全局配置,java 编意默认版本,1.6.修改配置
https://www.cnblogs.com/liu-s/p/5371289.html <!-- 修改Intellij Idea 创建maven项目默认Java编译版本 --> < ...