Search code examples
asp.net-mvcjqgridfree-jqgrid

How to trigger beforeSubmitCell event inside ondblClickRow event


I've a question related to jqgrid v4.15.4. I have used beforeSubmitCell event to return new array that will be posted to the server. Also I've kept options cellEdit: true , cellsubmit: 'remote'. By default, if a jqGrid cell is editable, single click on that cell changes it to edit mode.Which I know can be done with ondblClickRow. But how can I call beforeSubmitCell event inside ondblClickRow event function.

for references, I've read : jQGrid Cell Editing on double click of row

Let me know if more info required?


Solution

  • If I correctly understand your problem, the you should don't use the option cellEdit: true (but still use cellsubmit: 'remote') and to set cellEdit: true dynamically before calling cell editing methods (editCell, restoreCell, saveCell, prevCell or nextCell). Additionally you will have to duplicate the keyboard operations (see the lines of free jqGrid code). The resulting code could look like the code below:

    ondblClickRow: function (rowid, iRow, iCol, e) {
        var $self = $(this), p = $self.jqGrid("getGridParam");
        p.cellEdit = true;
        $self.jqGrid("editCell", iRow, iCol, true);
        p.cellEdit = false;
    },
    afterEditCell: function (rowid, cmName, cellValue, iRow, iCol) {
        var getTdByColumnIndex = function (tr, iCol) {
                var $t = this, frozenRows = $t.grid.fbRows;
    
                tr = frozenRows != null && frozenRows[0].cells.length > iCol ?
                        frozenRows[tr.rowIndex] : tr;
                return tr != null && tr.cells != null ? $(tr.cells[iCol]) : $();
            },
            $td = getTdByColumnIndex.call(this, this.rows[iRow], iCol),
            $self = $(this),
            $t = this,
            p = $self.jqGrid("getGridParam");
    
        $("input, select, textarea", $td).on("keydown", function (e) {
            if (e.keyCode === 27) { //ESC
                p.cellEdit = true;
                $self.jqGrid("restoreCell", iRow, iCol);
                p.cellEdit = false;
            } else if (e.keyCode === 13 && !e.shiftKey) { //Enter
                p.cellEdit = true;
                $self.jqGrid("saveCell", iRow, iCol);
                p.cellEdit = false;
                return false;
            } else if (e.keyCode === 9) {
                if (!$t.grid.hDiv.loading) {
                    p.cellEdit = true;
                    if (e.shiftKey) {
                        $self.jqGrid("prevCell", iRow, iCol); //Shift TAb
                    } else {
                        $self.jqGrid("nextCell", iRow, iCol); //Tab
                    }
                    p.cellEdit = false;
                } else {
                    return false;
                }
            }
            e.stopPropagation();
        });
    }
    

    See https://jsfiddle.net/OlegKi/Lm7akxz2/