jqgrid获取树形菜单所有的复选框勾选数据

jqgrid获取树形菜单所有的复选框勾选数据

  • jqgrid树形数据列表,代码如下:

function initTable() {
$("#tb1").jqGrid(“clearGridData”);
$("#tb1").jqGrid({
url:"/system/role/getRoleMenu",
datatype: “json”,
contentType : ‘application/x-www-form-urlencoded; charset=UTF-8’,
height: ‘auto’,
mtype : “POST”,
cellEdit:true,
width: $("#tbDiv").width()*0.999,
colNames:[‘id’,‘菜单’,‘按钮’],
colModel:[
{name : ‘id’,index : ‘id’,hidden:true,key:true},
{name : ‘menu’,index : ‘menu’,formatter : function(value, grid, rows, state){
var flag=’’;
if( rows.isSelecttrue ){
flag=‘checked’;
idArr.push( rows.id );
}
var row = JSON.stringify(rows).replace(/"/g, ‘"’);
return ‘ /> ‘+rows.menu;
}},
{name : ‘buttonList’,index : ‘buttonList’, formatter : function(value, grid, rows, state){
var row = JSON.stringify(rows).replace(/"/g, ‘"’);
var checkBoxGroup=’’;
if( rows.buttonList!=null ){
for( var i=0;i var flag=’’;
if( rows.buttonList[i].isSelect
true ){
flag=‘checked’;
idArr.push( rows.buttonList[i].id );
}
checkBoxGroup+=’ οnclick=“changeLimit(this)”/> ‘+rows.buttonList[i].menuButtonName+’  ’;
i>0?i%3==0?checkBoxGroup +=’
’:’’:’’;
}

           }   
           return checkBoxGroup; 
        }}
    ], 
    treeGrid: true,
    treeGridModel: "adjacency",
    ExpandColumn: "menu",
    treeIcons: {plus:'fa fa-caret-right',minus:'fa fa-caret-down',leaf:''},  
    sortname:"id",
    sortable:true,
    ExpandColClick: true,  
    multiselect: true,
    jsonReader: {
        repeatitems: false,
        root: "result", 
    },
    treeReader : {           //设置树形显示时4个关键字段对应的返回数据字段
        level_field: "level",      // 属性层级
        parent_id_field: "parent", //父级rowid 
        leaf_field: "isLeaf",      //是否还有子级菜单
        expanded_field: "expanded" //是否加载完毕
    },
    loadComplete :function(xhr){ 
       $("#loading").css('display','none');
    }
}).trigger('reloadGrid');   }

代码展示效果,如下图片:
jqgrid获取树形菜单所有的复选框勾选数据_第1张图片

  • 获取所有当前列表复选框勾选的数据id

使用jquery属性值选择器

$("#tb1 input:checkbox:checked").each(function(){
         idArr.push(Number( $(this).val() ))
 });

钩中父节点,子节点也勾中。子节点勾中,父节点勾中

  • 代码如下:

     function RelativeTreeGridCheck(row,That,e){
         idArr = [];
         var rowData = $('#tb1').jqGrid('getRowData', row.id,true);
         var childrenData = $('#tb1').jqGrid('getNodeChildren', rowData);
         var parentData = $('#tb1').jqGrid('getNodeParent', rowData);
         var rowChecked = $("#"+row.id).children().children().find("input").is(":checked");
         //  不为0,则为子节点,肯定有父节点,把父节点勾上
         if (childrenData.length != 0) {
             for (var i=0;i

获取按钮复选框选中的数据的id,放到最外层的数组中

var idArr = []

你可能感兴趣的:(前端笔记)