1

Preciso colocar a opção de Marcar e Desmarcar todos os checkbox listado pelo JQGRIDinserir a descrição da imagem aqui

não imagino como fazer. Abaixo o JS da tabela.

var grid = $("#jqGrid").jqGrid({
        url: '/Expedicao/Minuta/CarregaTransportadorNotas',
        datatype: 'json',
        mtype: 'GET',  
        postData: {
                  transportador: function () { return jQuery("#transportador").val(); }
        }, 
        colModel: [
             {name: "Escolher",width: 70, align: "center",
              formatter: "checkbox", formatoptions: { disabled: false},
              edittype: "checkbox", editoptions: {value: "Yes:No", defaultValue: "Yes"},
            stype: "select", searchoptions: { sopt: ["eq", "ne"], value: ":Any;true:Yes;false:No" } },
            { label: 'Codigo', name: 'doc', width: 250 },         
            { label: 'Série', name: 'serie', width: 180},         

        ],

        viewrecords: true,
            rowNum: 20,
            rowList: [20, 40, 100],
            height: "auto",
            //height: 400,
            emptyrecords: "Nenhuma Minuta ...",
            loadtext: "Buscando e carregando...",
            //rowNum: 20,
            pager: "#jqGridPager",
            loadonce: true

    });

    $("#jqGrid").jqGrid('navGrid', 'jqGridPager', { edit: false, add: false, del: false })

2 Respostas 2

1

Crie um <input type="checkbox" id="selAll"> Selecionar tudo fora da tabela (pode colocar acima da tabela. Você pode formatar da forma que quiser):

<input type="checkbox" id="selAll"> Selecionar tudo
<br>
<table id="jqGrid"></table>
<div id="jqGridPager"></div>

Ficará algo assim:

inserir a descrição da imagem aqui

E insira dois eventos no script para pegar os clicks nos checkboxs que irá fazer o controle, capturando os checkboxes da tabela pela classe table.ui-jqgrid-htable, que é a classe gerada pelo plugin:

$(":checkbox", "table.ui-jqgrid-htable").click(function(){

   if(!$(this).is(":checked")) $("#selAll").prop("checked", false);

   var cbs = $(":checkbox", "table.ui-jqgrid-htable");
   var allchkd = true;

   for(var x=0; x<cbs.length; x++){
      if(!$(cbs[x]).is(":checked")){
         allchkd = false;
         break;
      }
   }

   if(allchkd) $("#selAll").prop("checked", true );

});

$("#selAll").click(function(){
   var boxes = $(":checkbox", "table.ui-jqgrid-htable"); // pega os checkboxes da tabela
   boxes.prop("checked", $(this).is(":checked"));
});
1
  • Obrigada. Sua resposta funcionou também. Optei em usar o multiselect:true . que fica no próprio Grid. Valeu Commented 30/04/2018 às 11:17
0

Consegui de uma forma bem simples usando multiselect: true,

var grid = $("#jqGrid").jqGrid({
        url: '/Expedicao/Minuta/CarregaTransportadorNotas',
        datatype: 'json',
        mtype: 'GET',  
        postData: {
                    transportador: function () { return jQuery("#transportador").val(); }
        }, 
        colModel: [          
                    { label: 'Codigo', name:'doc', width:50 },         
                    { label: 'Série', name:'serie', width:50 },                     
                 ],

                loadonce: true,
                viewrecords: true,
                width: 780,
                height: 200,
                rowNum: 20,
                rowList : [20,30,50],
                rownumbers: true, 
                rownumWidth: 25, 
                multiselect: true,
                pager: "#jqGridPager"

    });



$("#jqGrid").jqGrid('navGrid', 'jqGridPager', { edit: false, add: false, del: false })

inserir a descrição da imagem aqui

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .