选择、取消、全选、全部取消、获取行ids

/**
* Created by lizongqiong on 2016/1/8.
*/
var $ = require('jquery');
var table = {
init:function(ele){
this.$ele = $(ele);
this.initCheckbox();
}, /**
* checkbox 事件初始化
*/
initCheckbox:function(){
var _this = this;
_this.$ele.on('mouseup',".title-checkbox",function(e){//全选checkbox
e.preventDefault();
var o = $(this);
if(o.attr('checked')){
_this.clearSelection();
}else{
_this.selectAll();
}
});
_this.$ele.on('mouseup','.row-select',function(e){//table中checkbox
e.preventDefault();
var row = $(this);
if($(this).attr('selected')){
_this.deselect(row);
}else{
_this.select(row);
} });
},
/**
* 选中一行
* @param row:行
*/
select:function(row){
row.attr('selected',true);
$(row.find("td :checkbox").eq(0)).attr('checked','checked');
}, /**
* 反选一行
* @param row:行
*/
deselect:function(row){
row.removeAttr('selected');
$(row.find("td :checkbox").eq(0)).removeAttr('checked');
}, /**
* 清空选中行
*/
clearSelection:function(){
var _this = this;
_this.$ele.find("tr[selected]").each(function(){
_this.deselect($(this));
})
},
/**
* 全部选中
*/
selectAll:function(){
var _this = this;
_this.$ele.find('tbody tr').each(function(){
var row = $(this);
row.attr('selected',true);
$(row.find("td :checkbox").eq(0)).attr('checked','checked');
});
},
/**
* 获取选中行
* @return [tr,tr,...]
*/
getSelection:function(){
return this.$ele.find("tr[selected]");
}, /**
* 获取选中id数组
* @return [1,2,3,...]
*/
getSelectedIds:function (){
var _this = this,
rows = _this.getSelection(),
ids = [];
for(var i=0,len=rows.length;i<len;i++){
ids.push($(rows[i]).attr('rid'));
}
return ids;
}
} module.exports = table;

table插件实现的更多相关文章

  1. bootstrap table 插件多语言切换

    在bootstrap中的bootstrap table 插件在多语言切换的审核,只需要如下操作 引入bootstrap-table-locale-all.js文件 $('#Grid').bootstr ...

  2. 基于jquery的json转table插件jsontotable

    分享一款基于jquery的json转table插件jsontotable.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="container ...

  3. layui 框架 table插件 实现键盘快捷键 切换单元格编辑

    最近使用layui的框架时,发现table插件不支持键盘快捷键切换单元格,花了点时间实现此功能. 分享给有需要的朋友们~~~ 效果图 代码: 1.支持 enter,上,下,右键 切换单元格,支持隐藏列 ...

  4. bootstrap table插件动态加载表头

    这篇文章主要为大家详细介绍了bootstrap table插件动态加载表头,具有一定的参考价值,感兴趣的小伙伴们可以参考一下   bootstrap的table属性已经很熟悉了,最近遇到一个问题,犹豫 ...

  5. 表格(table) 插件:支持当前行增行、删除。使用事件委托

    最近做一个项目,需要对表格进行增行和删行. 研究了一下jquery操作dom的方法和事件委托原理,下面是我编写的例子,源码传上,欢迎高手指点. 功能: 支持在指定行下面增行: 支持删行指定行: 增行. ...

  6. 使用bootstrap table 插件固定表头时 表头与表格内容无法对齐

    在使用bootstrap table开发后台管理系统,表格利用bootstrap-table插件来实现,使用bootstrap-table过程中,会出现表头错位的情况 表头对不齐效果: 解决的方法: ...

  7. Jquery Data Table插件

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  8. 在ASP.NET MVC中使用 Bootstrap table插件

    Bootstrap table: http://bootstrap-table.wenzhixin.net.cn/zh-cn/getting-started/ 1. 控制器代码: using Syst ...

  9. 利用BootStrap Table插件实现自己的弹出框分页。

    参考链接1:    官网:http://bootstrap-table.wenzhixin.net.cn/zh-cn/home/        开始使用:http://bootstrap-table. ...

随机推荐

  1. java中遍历集合的三种方式

    第一种遍历集合的方式:将集合变为数组 package com.lw.List; import java.util.ArrayList; import java.util.List; import ja ...

  2. 制作图表二、使用图片工厂设置RGB改变图标颜色

    亮绿 RGB:76 175 80灰色 RGB:151 151 153

  3. 如何关闭windows电脑的开机自启程序

    很多时候我们打开电脑会发现,莫名其妙的出现一些已经在运行的程序了,这都是一些开机自启的软件之类的.可能你的电脑配置本来就不怎么高,开机还这样,那估计会很卡顿,那有什么方法可以关闭这些开机自动启动的程序 ...

  4. Windows10 如何删掉内置的 skype ?

    打开开始菜单,输入“PowerShell”并回车: 运行“Get-AppxPackage -User username”命令( username 请替换成当前实际用户名),此时会显示所有已安装的应用程 ...

  5. angularjs与require的集成摘抄

    基于requireJS和angularJS的前端技术架构 :http://blog.163.com/liuyong_xiaxia/blog/static/17435525520156341446981 ...

  6. [Effective JavaScript 笔记]第64条:对异步循环使用递归

    假设需要有这样一个函数,接收一个URL的数组并尝试依次下载每个文件直到有一个文件被成功下载.如果API是同步的,使用循环很简单实现. function downloadOneSync(urls){ f ...

  7. phpcms V9 数据模型基类

    在学习<phpcms V9首页模板文件解析>的第七步,我们看到content_model类,文件路径:phpcms/model/content_model.class.php 从代码中,可 ...

  8. PowerDesigner反向工程,根据Oracle数据库结构生成ER图(2014-3-25记)

    01.添加数据服务端 02. PowerDesigner 1. 新建PDM:选择菜单File->New Model,[Model type]选择Physical Data Model,[DBMS ...

  9. UICollectionViewDelegateFlowLayout 使用

    import UIKit //UICollectionViewLayout //itemSize属性 //设定全局的Cell尺寸,如果想要单独定义某个Cell的尺寸,可以使用下面方法: // - (C ...

  10. iOS 开发笔记-AFNetWorking https SSL认证

    一般来讲如果app用了web service , 我们需要防止数据嗅探来保证数据安全.通常的做法是用ssl来连接以防止数据抓包和嗅探 其实这么做的话还是不够的 . 我们还需要防止中间人攻击(不明白的自 ...