full - jqgrid guriddo

JQgrid checkbox onclick base de datos de actualización

Question

Tengo una columna de casilla de verificación en mi JqGrid que se carga de la base de datos, por lo que está marcada o no marcada cuando se carga.

Lo que quiero es: si la casilla de verificación está siendo marcada o no marcada por el usuario, quiero actualizar la base de datos al mismo tiempo. No quiero que el usuario presione enter ni nada. solo 1 clic y enviar acción a DB

nombre: ''Aktiv'', índice: ''Aktiv'', ancho: 100, tipo de edición: ''casilla de verificación'', alinear: ''centro'', formateador: ''casilla de verificación'', editable: true, formatoptions: {inhabilitado: falso}

Answer 1

Puede establecer el controlador de eventos click dentro de loadComplete :

loadComplete: function () {
    var iCol = getColumnIndexByName ($(this), ''Aktiv''), rows = this.rows, i,
        c = rows.length;

    for (i = 1; i < c; i += 1) {
        $(rows[i].cells[iCol]).click(function (e) {
            var id = $(e.target).closest(''tr'')[0].id,
                isChecked = $(e.target).is('':checked'');
            alert(''clicked on the checkbox in the row with id='' + id +
                  ''/nNow the checkbox is '' +
                  (isChecked? ''checked'': ''not checked''));
        });
    }
}

dónde

var getColumnIndexByName = function(grid, columnName) {
        var cm = grid.jqGrid(''getGridParam'', ''colModel''), i, l;
        for (i = 1, l = cm.length; i < l; i += 1) {
            if (cm[i].name === columnName) {
                return i; // return the index
            }
        }
        return -1;
    };

En lugar de la alert , debe usar jQuery.ajax para enviar al servidor la información sobre el cambio del estado de la casilla de verificación.

Puedes ver aquí una demostración.

Answer 2

Una pequeña corrección en la función loadComplete: (). en la demostración, puede encontrar que incluso después de marcar la casilla de verificación, si hace clic fuera de la casilla de esa celda, el valor cambia a ''falso'' de ''verdadero''.

Para evitar esto, solo da el foco exactamente en la casilla de verificación solo haciendo lo siguiente.

for (i = 1; i < c; i += 1) {
    $((''input[type="checkbox"]''),rows[i].cells[iCol]).click(function (e) {
        var id = $(e.target).closest(''tr'')[0].id,
            isChecked = $(e.target).is('':checked'');
        alert(''clicked on the checkbox in the row with id='' + id +
              ''/nNow the checkbox is '' +
              (isChecked? ''checked'': ''not checked''));
    });
}

y gracias por la respuesta :-) (@Oleg) me ayudó mucho ... a tiempo, por supuesto ...;)

Answer 3

Para cambiar los valores de otra columna según el clic de la casilla de verificación

var weightedAvgPriceIndex = getColumnIndexByName($(this), ''WeightedAveragePrice''),
    rows = this.rows,
    i,
    c = rows.length;

for (i = 1; i < c; i += 1) {
    $((''input[type="checkbox"]''),rows[i].cells[iCol]).click(function (e) {
      var id = $(e.target).closest(''tr'')[0].id;
      isChecked = $(e.target).is('':checked'');
      var x = $(''#'' + id + '' td:eq('' + weightedAvgPriceIndex + '')'').text();
      $(''#'' + id + '' td:eq('' + weightedAvgPriceIndex + '')'').text(Math.abs(x) + 10);
    });
}