原文地址;http://www.cnblogs.com/josechuanmin/archive/2013/05/19/3087138.html

在jqGrid中设置multiselect: true可以实现全选的操作,但怎么设置被选中的checkbox里面的值呢,做法如下:
jQuery("#listTable").jqGrid({
   url: 'queryList.do',
   datatype: 'json',
   colNames: ['','编号','姓名'],
   colModel: [
               { 
                 name: 'MY_ID',
                 index: 'MY_ID',
                 sortable: false,
                 width: '0%',
                 hidden:true
               },
               {
                 name: 'MY_NO',
                 index:'MY_NO',
                 sortable: false,
                 align:'center',
                 width:'10%'
               },
              {
                 name: 'NAME',
                 index:'NAME',
                 sortable: false,
                 align:'center',
                 width:'10%'
              }
            ],
            page: 1,
            rowNum: 10,
            rowList: [10, 20, 30],
            pager: '#listPage',
            multiselect: true,
            sortname: 'MY_NO',
            viewrecords: true,
            sortorder: "desc",
            jsonReader: {
                repeatitems: false
            },
            width: "100%",
            height: '100%',
            gridComplete: function() {
                var rowIds = jQuery("#listTable").jqGrid('getDataIDs');
                for(var k=0; k<rowIds.length; k++) {
                   var curRowData = jQuery("#listTable").jqGrid('getRowData', rowIds[k]);
                   var curChk = $("#"+rowIds[k]+"").find(":checkbox");
                   curChk.attr('name', 'checkboxname');   //给每一个checkbox赋名字
                   curChk.attr('value', curRowData['MY_ID']);   //给checkbox赋值
                   curChk.attr('title', curRowData['NAME'] );   //给checkbox赋予额外的属性值

                   //curChk.attr('checked', 'true');   //设置所有checkbox被选中
                }

 
                //下面的代码顺序不能变(这是页面上所有行被真选中[所有行被黄色])

                //$("#cb_listTable").attr("checked", true);
                //$("#cb_listTable").click();   //input框
                //$("#jqgh_listTable_cb").click();   //div标签
                //$("#listTable_cb").click();   //th标签

}
});

加载完列表后获取被选中的checkbox的值及其属性值的做法如下:
var checkedVals = new Array();
var checkedTitles = new Array();
$(":checkbox[name=checkboxname][checked]").each(function(){
      checkedVals.push($(this).val());
      checkedTitles.push($(this).attr("title"));
});
for(var p=0; p<checkedVals.length; p++){
    alert(checkedVals[p]);
    alert(checkedTitles[p]);
}

--------------------------------------------------------------------------------------------------
让查询列表中按指定条件被默认选中或灰掉checkbox的做法如下:
jQuery("#listTable").jqGrid({
   url: 'queryList.do',
   datatype: 'json',
   colNames: ['','编号','姓名'],
   colModel: [
               { 
                 name: 'MY_ID',
                 index: 'MY_ID',
                 sortable: false,
                 width: '0%',
                 hidden:true
               },
               {
                 name: 'MY_NO',
                 index:'MY_NO',
                 sortable: false,
                 align:'center',
                 width:'10%'
               },
              {
                 name: 'NAME',
                 index:'NAME',
                 sortable: false,
                 align:'center',
                 width:'10%'
              }
            ],
            page: 1,
            rowNum: 10,
            rowList: [10, 20, 30],
            pager: '#listPage',
            multiselect: true,
            multiboxonly: true,
            sortname: 'MY_NO',
            viewrecords: true,
            sortorder: "desc",
            jsonReader: {
                repeatitems: false
            },
            width: "100%",
            height: '100%',
            gridComplete: function() {
                var rowIds = jQuery("#listTable").jqGrid('getDataIDs');
                for(var k=0; k<rowIds.length; k++) {
                   var curRowData = jQuery("#listTable").jqGrid('getRowData', rowIds[k]);
                   if(curRowData.MY_NO == '123456'){
                        $("#listTable").find("input[id='jqg_" + rowIds[k] +
                                                                      "']").val(curRowData.MY_ID);
                        if(curRowData.NAME=='shihuan'){
                            $("#listTable").find("input[id='jqg_" + rowIds[k] +
                                                                      "']").attr("checked", true);
                        }
                    }else{
                        $("#listTable").find("input[id='jqg_" + rowIds[k] +
                                                                      "']").val(curRowData.MY_ID);
                        $("#listTable").find("input[id='jqg_" + rowIds[k] + "']").attr("checked",
                                                                                            true);
                        $("#listTable").find("input[id='jqg_" + rowIds[k] + "']").attr("disabled",
                                                                                            true);
                    }
                }
            }
            onSelectAll:function(rowid, status) { //rowid 数组
                var ids = jQuery("#listTable").jqGrid('getDataIDs');
                for (var i=0; i<ids.length; i++) {
                    var cl = ids[i];
                    var curRowData = jQuery("#listTable").jqGrid('getRowData', cl);
                    var ckt = $("#listTable").find("input[id='jqg_" + cl + "']").attr("disabled");
                    if(ckt){
                        $("#listTable").find("input[id='jqg_" + cl + "']").attr("checked", true);
                    }
                }
            },
            beforeSelectRow:function(rowid, e){
                //alert(rowid);   //rowid的值是checkbox的value值
                return false;
            }
});
--------------------------------------------------------------------------------------------------
jqGrid被重新载入的做法如下:
function gridReload() {
    jQuery("#listTable").jqGrid('setGridParam', {
                //url:'../../../com/shihuan/search.do',
                //postData: transferFormElementsToObject('theForm'),
                postData: {"message":msval},
                page:1
            }).trigger("reloadGrid");
}

 

jqGrid中多选的更多相关文章

  1. jqGrid中multiselect: true 操作checkbox

    在jqGrid中设置multiselect: true可以实现全选的操作,但怎么设置被选中的checkbox里面的值呢,做法如下:jQuery("#listTable").jqGr ...

  2. [原创]纯JS实现网页中多选复选框checkbox和单选radio的美化效果

    图片素材: 最终效果图: <html><title> 纯JS实现网页中多选复选框checkbox和单选radio的美化效果</title><head>& ...

  3. jqGrid中选择的行的数据[转]

    如何获取jqGrid中选择的行的数据? 下面可以获取选择一行的id,如果你选择多行,那下面的id是最后选择的行的id: var id=$(‘#gridTable’).jqGrid(‘getGridPa ...

  4. jqGrid中实现radiobutton的两种做法

    http://blog.sina.com.cn/s/blog_4f925fc30102e27j.html   jqGrid中实现radiobutton的两种做法 ------------------- ...

  5. JS 获取select(多选下拉)中所选值的示例代码

    通过js获取select(多选下拉)中所选值,具体实现如下,有需要的朋友可以参考下,希望对大家有所帮助 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML ...

  6. 如何获取jqGrid中选择的行的数据

    原文地址:http://hi.baidu.com/feifan3211/item/c5831f44158761a5df2a9fc1 如何获取jqGrid中选择的行的数据? 下面可以获取选择一行的id, ...

  7. C#中datagridview选中行后textbox显示选中的内容

    我想让datagridview中某一行被选中时,textbox中显示选中的值,datagridview的选中模式是整行:this.dataGridView1.SelectionMode = DataG ...

  8. 获取jqGrid中选择的行的数据以及 jqGrid获得所有行数据的方法

    获取jqGrid中选择的行的数据: 获取选择一行的id,如果你选择多行,那下面的id是最后选择的行的id:   1 var id=$('#gridTable').jqGrid('getGridPara ...

  9. C#——DataGridView选中行,在TextBox中显示选中行的内容

    C#--DataGridView选中行,在TextBox中显示选中行的内容,在DataGridView的SelectionChanged实践中设置如下代码 private void dataGridV ...

随机推荐

  1. 第六篇:R语言数据可视化之数据分布图(直方图、密度曲线、箱线图、等高线、2D密度图)

    数据分布图简介 中医上讲看病四诊法为:望闻问切.而数据分析师分析数据的过程也有点相似,我们需要望:看看数据长什么样:闻:仔细分析数据是否合理:问:针对前两步工作搜集到的问题与业务方交流:切:结合业务方 ...

  2. js获取当前url地址及参数

    介绍:设置或获取对象指定的文件名或路径. window.location.pathname //返回 设置或获取整个 URL 为字符串. window.location.href 设置或获取与 URL ...

  3. java的通信机制

    通信机制无非就那几种:http访问.socket访问: http又分为:jsp.servlet.html,用的就是get和post方法 socket则可分为:tcp或者udp方式 从以上内容又衍生出其 ...

  4. Linux开发工具之Makefile(上)

    二.makefile(上) 01.make工具   利用make工具可以自动完成编译工作.这些工作包括:如果修改了某几 个源文件,则只重装新编译这几个源文件:如果某个头文件被修改了,则 重新编译所有包 ...

  5. struts.enable.DynamicMethodInvocation = true 动态方法调用(转)

    原文地址:http://blog.csdn.net/wfcaven/article/details/5937557 default.properties 在Struts 2的核心jar包-struts ...

  6. FileWriter类的flush方法的作用

    FileWriter类的flush方法的作用 每次io都会影响性能,将需要写入的内容,放入缓冲区中,然后调用flush方法,将缓冲区内容写入文件中.

  7. linux list all users.

    cat /etc/passwd sample of list users in linux. ref: Linux Command: List All Users In The System

  8. win7+SQL2008无法打开物理文件 操作系统错误 5:拒绝访问 SQL Sever

    今天在win7+SQL2008的环境下操作分离附加数据库,分离出去然后再附加,没有问题.但是一把.mdf文件拷到其它文件夹下就出错,错误如下:无法打开物理文件 "E:\db\MyDB.mdf ...

  9. Xcode7 通过 Single View Application 得到一个 Empty Application 工程

    方法: 创建一个 Empty Application 工程 下面还是详细的说一下通过一个 Single View Application 工程得到一个 Empty Application 工程的方法: ...

  10. linux之umask函数解析

    [lingyun@localhost umask_1]$ vim umask.c  + umask.c                                                 ...