flexigrid插件增加复选框
来源:互联网 发布:360游戏优化器安卓版 编辑:程序博客网 时间:2024/06/05 09:25
怎么在flexigrid里面加上checkbox呢?就这个问题,我们来看看:
首先,我们对flexigrid里面的代码进行一下修改:
//下面是原代码
//$('div:eq(' + n + ')', g.cDrag).css({ 'left': cdpos + 'px' }).show();
//添加多选框第1处
if (p.checkbox) {
$('div:eq('+n+')',g.cDrag).css({'left':cdpos+22+'px'}).show();
}
else{
$('div:eq('+n+')',g.cDrag).css({'left':cdpos+'px'}).show();
}
//添加多选框-结束----------第1处-----
-----------------------------------------------------------
在修改第二处时:找到 //add cell 这段代码,找到之后,在//add cell后面插入如下段代码
//add cell
//添加多选框 ------------开始----第2处----------作用 是添加选中后的样式
if (p.checkbox) {
var cth = $('<th/>');
var cthch = $('<input type="checkbox" value="' + $(tr).attr('id') +'"/>');//value可根据需要进行修改
var objTr = $(tr);
cthch.addClass("noborder").click(function(){
if(this.checked){
objTr.addClass('trSelected');
}
else{
objTr.removeClass('trSelected');
}
})
cth.addClass("cth").attr({ width: "19"}).append(cthch);
$(tr).prepend(cth);
}
//添加多选框 [修改后代码 时间:2011-04-08]------------结束----第2处-----------
也就是在$('thead tr:first th', g.hDiv).each 这段代码的上面。
------------------------------------------------------------
//添加多选框 [修改后代码 时间:2011-04-08]------------开始-------第3处--------
if(p.checkbox){
if($(this).hasClass('trSelected')){
$(this).find('input')[0].checked=true;
}
else{
$(this).find('input')[0].checked=false
}
}
//添加多选框 [修改后代码 时间:2011-04-08]------------结束-------第3处--------
这是第三处需要修改的代码,在$(this).toggleClass('trSelected');这段代码的下面,if (p.singleSelect) $(this).siblings().removeClass('trSelected');这段代码的上面,代码是放在addRowProp: function () 这个函数里面。
-------------------------------------------------------------
//添加多选框 [修改后代码 时间:2011-04-08]------------开始--------第4处-------
if (p.checkbox) {
$('tr', g.hDiv).each(
function () {
var cth = $('<td/>');
var cthch = $('<input type="checkbox"/>');
cthch.click(function () {
if (this.checked) {
$('tbody tr', g.bDiv).each(function () {
$(this).addClass('trSelected').find('input')[0].checked = true;
})
}
else {
$('tbody tr', g.bDiv).each(function () {
$(this).removeClass('trSelected').find('input')[0].checked = false;
})
}
})
cth.addClass("cth").attr({ width: "22" }).append(cthch);
$(this).prepend(cth);
})
};
//添加多选框 [修改后代码 时间:2011-04-08]------------结束--------第4处-------
这是第四处代码,也是最后一处需要修改的代码,找到如下代码:$('th div', g.hDiv).each 在找到它之后,放在 cn++;});这段代码的后面,也就是if ($.browser.msie && $.browser.version < 7.0) 这段代码之前。
原文链接:http://blog.csdn.net/ailinty/article/details/7339489
- flexigrid插件增加复选框
- dataGridView增加复选框
- listview增加一个复选框
- jquery grid插件 Flexigrid
- 【jQuery插件】flexigrid
- flexigrid插件使用心得
- flexigrid插件使用
- 给GridPanel增加行复选框按钮
- jQuery插件Highcharts、flexigrid实践
- jquery grid插件 Flexigrid + servlet
- jQuery插件flexigrid使用总结
- jQuery插件flexigrid使用总结
- Jquery插件flexigrid 参数 详解
- Jquery插件FLexiGrid完全配置
- jQuery插件flexigrid使用总结
- jQuery插件flexigrid使用总结
- jQuery插件flexigrid使用总结
- jquery flexigrid 增加行双击事件
- Android Studio 接入OpenCV 3.2.0 并不使用OpenCV_Manager_3.2.0的APK包来进行图像处理
- 信号高级特性
- 后台传来毫秒格式日期换成年月日时分秒显示在前台
- xlistview刷新 加载方法
- 阻塞和非阻塞系统调用
- flexigrid插件增加复选框
- opencv findContuors 详解
- 总结:让一个div垂直水平居中
- I
- Java 归并排序
- 动态规划问题总结
- day10 tcp状态转换
- 深度学习 —— 逻辑回归
- postfix空壳邮件