JQGrid call a function with a click on a cell passing the line id

Question

JQGrid call a function with a click on a cell passing the line id

Navigation

#1 by (1 votes)

1

Good morning, I need 2 help from you. First time with JQGrid.

I need to add another column in the grid with an image that will call a modal by passing the value of the line ID.

2- I also need to put a function that will open the editing screen with double click on. I can do with a click on the line, but that does not work for me, it has to be double clicked.

$(function () {
    var grid = $("#jqGrid").jqGrid({
        //url: '@Url.Action("Lista","Perfil", new { Area = "Gerenciamento" })',
        url:'/Gerenciamento/Perfil/ListaPeloDAO',
        mtype: 'GET',
        datatype: 'json',
        colModel: [
            { label: 'Id', name: 'id', width: 50 },
            { label: 'Descricao', name: 'descricao', width:380 }, 
        ],
        loadonce: true,
        pager: '#jqGridPager',
        rowNum: 10,
        rowList: [10, 20, 30, 50],
        viewrecords: true,
        height: 250
    });
    $("#jqGrid").jqGrid('navGrid', 'jqGridPager', { edit: false, add: false, del: false })
    jQuery("#jqGrid").click(function () {
        //Pega Id linha selecinada 
        var PegaIdDaGRid = grid.getGridParam("selrow");
        //Chama a tela do Editar passando o ID
        window.location = '/Gerenciamento/Perfil/Cadastro/' + PegaIdDaGRid;
    });
});

jquery jqgrid javascript-eventos

asked by anonymous 19.03.2018 / 13:38

1 answer

Calculate and Decrease Values in Array How to return a table from a POSTGRES function?

score 1 · Accepted Answer

For knowledge, it follows the result, everything working perfectly, with double click and with image:

$(function () {

    var grid = $("#jqGrid").jqGrid({
        //url: '@Url.Action("Lista","Recurso", new { Area = "Gerenciamento" })',
        url:'/Gerenciamento/UsuarioExterno/Listar',
        mtype: 'GET',
        datatype: 'json',
        colModel: [
            { label: 'ID', name: 'id',width:50 },
            { label: 'codigo', name: 'codigoRepresentante', width:80 },
            { label: 'Nome', name: 'nome' , width:200 },           
            { label: 'Email', name: 'email', width:80  },           
            { label: 'Cpf', name: 'cpf', width:80  },           
            {
                label: 'Data_Inclusao', name: 'data_inclusao', formatter: 'date', width:100, 
                formatoptions: { srcformat: 'd/m/y', newformat: 'd/m/y H:s' }
            },

            { name: 'Perfil', index: 'recursos', width: 80, align: "center", editable: true, formatter: adicionarRecurso },  
            { name: 'Exceção', index: 'recursos', width: 80, align: "center", editable: true, formatter: adicionarExcecao },  
        ],

        loadonce: true,
        pager: '#jqGridPager',
        rowNum: 10,
        rowList: [10, 20, 30, 50],
        viewrecords: true,
        height: 250

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

    jQuery("#jqGrid").dblclick(function () {

        //Pega Id linha selecinada 
        var PegaIdDaGRid = grid.getGridParam("selrow");
        //Chama a tela do Editar passando o ID
        window.location = '/Gerenciamento/UsuarioExterno/Cadastro/' + PegaIdDaGRid;

    });

    function adicionarRecurso(cellValue, options, rowdata, action) {
        return "<a href='/Gerenciamento/UsuarioExterno/Perfil/" + options.rowId + "'>+ Perfil</a>";        
    }  

    function adicionarExcecao(cellValue, options, rowdata, action) {
        return "<a href='/Gerenciamento/UsuarioExterno/Excecao/" + options.rowId + "'>+ Exceção</a>";        
    }  
});