Search code examples
javascriptjquerycheckboxjqgrid

Skip checkbox in multi select in jqgrid conditional


I saw Oleg answer when clicking the multiselect checkbox in the jqgrid header it remove the check when the checkbox is disabled. (correct me if i'm wrong). But in my case I want to skip the rowdata or I don't want to check the checkbox if the row value Status is approved.

enter image description here

I tried this one

onSelectAll: function (aRowids, status) {
  $.each(aRowids, function (i, val) {
     var gridId = "#List";
     var rowData = jQuery(gridId).jqGrid('getRowData', val);
     var g = $("#List");
     var cbs = $("tr.jqgrow > td > " + rowData.Status == "Approved", g[0]);
     cbs.removeAttr("checked");
   }
}

but nothing happen. It still checks the status approved.


Solution

  • Here you go with a solution http://jsfiddle.net/HJema/632/

    var myData = [{
        id: 1,
        status: "Rejected"
    }, {
        id: 2,
        status: "Approved"
    }, {
        id: 3,
        status: "Rejected"
    }, ];
    
    $("#list").jqGrid({
        datatype: "local",
        colNames: ["Id", "Status"],
        colModel: [{
            name: "id",
            index: "id",
            sorttype: "int"
        }, {
            name: "status",
            index: "status"
        }],
        caption: "Viz Test",
        pager: '#pager',
        search: true,
        multiselect: true,
        data: myData,
        loadComplete: function(data) {
        	for (var i = 0; i < data.rows.length; i++) {
          	if(data.rows[i].status == "Approved"){   
            	$('#jqg_list_' + (i+1)).attr('disabled', true);
            }
          }
        }
    });
    <link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css" rel="stylesheet"/>
    <link href="http://trirand.com/blog/jqgrid/themes/ui.jqgrid.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script src="http://trirand.com/blog/jqgrid/js/jquery.jqGrid.min.js"></script>
    <script src="http://trirand.com/blog/jqgrid/js/i18n/grid.locale-en.js"></script>
    <table id="list"></table>
    <div id="pager"></div>

    There is some problem with the Stackoverflow snippet, please refer to the jsfiddle.

    Hope this will help you