jqGrid - 复选框更改事件和单元格值更新

时间:2015-08-18 23:53:43

标签: jquery jqgrid

我有以下表格声明:

$("#lotesAsignados").jqGrid({
        datatype: "local",
        height: 200,
        colNames: ["LOTE","recepcionId","FECHA REC.","P. BRUTO","TIPO MAT.","PESADA VACIADA","CARGUIO MAQUINA","EMBOLSADA ARRUMADA","SOLO COMUNEADA","SOLO VACIADA","SOLO PESADA","SOLO EMBOLSADA","COSTO MANIPULEO"],
        colModel:[ {name:'lote',index:'lote', width:70},
            {name:'recepcionId',index:'recepcionId', width:5, hidden: true},
            {name:'fechaDeRecepcion',index:'fechaDeRecepcion', width:70},
            {name:'pesoBruto',index:'pesoBruto', width:60},
            {name:'tipoDeMaterial',index:'tipoDeMaterial', width:80},
            {name:'pesadaVaciada',index:'pesadaVaciada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'carguioMaquina',index:'carguioMaquina', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'embolsadaArrumada',index:'embolsadaArrumada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'soloComuneada',index:'soloComuneada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'soloVaciada',index:'soloVaciada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'soloPesada',index:'soloPesada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'soloEmbolsada',index:'soloEmbolsada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'costoManipuleo',index:'costoManipuleo', width:80} ],
        onSelectRow: function(id){
        },
        multiselect: false,
        caption: "LOTES A PAGAR"
    });

我的视图中有一些隐藏字段,用于包含根据公式进行计算的参数:

costoManipuleo = pesadaVaciada + carguioMaquina + embolsadaArrumada + soloComuneada + soloVaciada + soloPesada + soloEmbolsada

给出值(只是和示例):

pesadaVaciada = 10
carguioMaquina = 15
embolsadaArrumada = 10
soloComuneada = 5
soloVaciada = 10
soloPesada = 20
soloEmbolsada = 10

渲染表: tabla_manipuleo

对于LOTE:PX-CM070199 ,如果选中pesadaVaciadasoloComuneadasoloEmbolsada复选框,则costoManipuleo单元格必须包含{{1} }}

对于LOTE:PX-CM070200 ,如果选中所有复选框,则25单元格必须包含costoManipuleo

我已尝试修改thisthis解决方案以满足我的需求,但我一无所知。我不知道如何识别单击了哪个复选框,当我看到复选框的呈现HTML代码是这样的时候,对我来说变得更难:

70

1 个答案:

答案 0 :(得分:0)

这个jqGrid声明解决了我的问题:

$("#lotesAsignados").jqGrid({
        datatype: "local",
        height: 200,
        colNames: ["LOTE","recepcionId","FECHA REC.","P. BRUTO","TIPO MAT.","PESADA VACIADA","CARGUIO MAQUINA","EMBOLSADA ARRUMADA","SOLO COMUNEADA","SOLO VACIADA","SOLO PESADA","SOLO EMBOLSADA","COSTO MANIPULEO"],
        colModel:[ {name:'lote',index:'lote', width:70},
            {name:'recepcionId',index:'recepcionId', width:5, hidden: true},
            {name:'fechaDeRecepcion',index:'fechaDeRecepcion', width:70},
            {name:'pesoBruto',index:'pesoBruto', width:60},
            {name:'tipoDeMaterial',index:'tipoDeMaterial', width:80},
            {name:'pesadaVaciada',index:'pesadaVaciada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'carguioMaquina',index:'carguioMaquina', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'embolsadaArrumada',index:'embolsadaArrumada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'soloComuneada',index:'soloComuneada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'soloVaciada',index:'soloVaciada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'soloPesada',index:'soloPesada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'soloEmbolsada',index:'soloEmbolsada', width:70, edittype:"checkbox",editoptions: {value:"Si:No"},editable: true,formatter: "checkbox", formatoptions: {disabled : false} },
            {name:'costoManipuleo',index:'costoManipuleo', width:80} ],
        beforeSelectRow: function (rowid, e) {
            var $target = $(e.target), $td = $target.closest("td"),
                iCol = $.jgrid.getCellIndex($td[0]),
                colModel = $(this).jqGrid("getGridParam", "colModel");
            if (iCol >= 0 && $target.is(":checkbox")) {
                alert("checkbox is " +
                    ($target.is(":checked")? "checked" : "unchecked") +
                    " in the column \"" + colModel[iCol].name +
                    "\" in the row with rowid=\"" + rowid + "\"");
                var rowData = $('#lotesAsignados').jqGrid('getRowData', rowid);
                var _costoManipuleo=parseFloat(rowData.costoManipuleo);
                var _pesadaVaciada=0;
                var _carguioMaquina=0;
                var _embolsadaArrumada=0;
                var _soloComuneada=0;
                var _soloVaciada=0;
                var _soloPesada=0;
                var _soloEmbolsada=0;

                switch(colModel[iCol].name){
                    case "pesadaVaciada": _pesadaVaciada= $target.is(":checked")? parseFloat($("#pesadaVaciada").val()):-parseFloat($("#pesadaVaciada").val());
                        _costoManipuleo=_costoManipuleo+_pesadaVaciada;
                        break;
                    case "carguioMaquina": _carguioMaquina= $target.is(":checked")? parseFloat($("#carguioMaquina").val()):-parseFloat($("#carguioMaquina").val());
                        _costoManipuleo=_costoManipuleo+_carguioMaquina;
                        break;
                    case "embolsadaArrumada": _embolsadaArrumada= $target.is(":checked")? parseFloat($("#embolsadaArrumada").val()):-parseFloat($("#embolsadaArrumada").val());
                        _costoManipuleo=_costoManipuleo+_embolsadaArrumada;
                        break;
                    case "soloComuneada": _soloComuneada= $target.is(":checked")? parseFloat($("#soloComuneada").val()):-parseFloat($("#soloComuneada").val());
                        _costoManipuleo=_costoManipuleo+_soloComuneada;
                        break;
                    case "soloVaciada": _soloVaciada= $target.is(":checked")? parseFloat($("#soloVaciada").val()):-parseFloat($("#soloVaciada").val());
                        _costoManipuleo=_costoManipuleo+_soloVaciada;
                        break;
                    case "soloPesada": _soloPesada= $target.is(":checked")? parseFloat($("#soloPesada").val()):-parseFloat($("#soloPesada").val());
                        _costoManipuleo=_costoManipuleo+_soloPesada;
                        break;
                    case "soloEmbolsada": _soloEmbolsada= $target.is(":checked")? parseFloat($("#soloEmbolsada").val()):-parseFloat($("#soloEmbolsada").val());
                        _costoManipuleo=_costoManipuleo+_soloEmbolsada;
                        break;
                }
                rowData.costoManipuleo = _costoManipuleo;
                $('#lotesAsignados').jqGrid('setRowData', rowid, rowData);
            }
            return true;
        },
        multiselect: false,
        caption: "LOTES A PAGAR"
    });