jQuery - jqGrid - undesired behavior in onSelectRow event

前端 未结 1 712
爱一瞬间的悲伤
爱一瞬间的悲伤 2021-01-25 04:54

I had a previous question regarding having buttons available in each row of a jqGrid, that would activate when the row was selected. With help from @Oleg I was abl

相关标签:
1条回答
  • 2021-01-25 05:48

    It's wrong to bind button (to use .click) inside of onSelectRow callback.

    Instead of you can move the code with registering click event handler inside of loadComplete. You can just move the code from onSelectRow to loadComplete and replace $(tr) to $(this) to search inside of all buttons of the grid and not only the buttons of selected row. You can still set or remove disabled attribute inside of onSelectRow callback.

    More better would be to make no individual binding for every button. One can just use onCellSelect or beforeSelectRow which will be called from click handler bound on whole grid. See the answer and this one for code examples.

    UPDATED: I am not sure that I understand correctly your problem, but I hope that the demo will demonstrate the solution of the problem. I don't used any explicit click handler. The most important change (which could important if you use Internet Explorer) is adding class='cbox' to the formatter to prevent return in the line of jqGrid code. The most important part of the code is below

    colModel: [
        { name: "text", width: 500 },
        { name: "msgAct", width: 150,
            formatter: function () {
                return "<input name='resendMsg' class='cbox' style='height:25px;width:65px;' type='submit' value='Re-Send' disabled='disabled'/>" +
                    "<input name='cancelMsg'  class='cbox' style='height:25px;width:55px;' type='submit' value='Cancel' disabled='disabled'/>"
            }}
    ],
    onSelectRow: function (rowid) {
        var tr = $(this).jqGrid("getInd", rowid, true);
        $(this).find("input[name=resendMsg],input[name=cancelMsg]").attr("disabled", "disabled");
        $(tr).find("input[name=resendMsg],input[name=cancelMsg]").removeAttr("disabled");
    },
    beforeSelectRow: function (rowid, e) {
        var $self = $(this),
            $td = $(e.target).closest("td"),
            iCol = $.jgrid.getCellIndex($td[0]),
            name = $(e.target).attr("name");
        if (this.p.colModel[iCol].name === "msgAct") {
            if (name === "resendMsg") {
                alert("'Re-Send' button clicked in the row with id=" + rowid +
                    "\ntext in the row =\"" + $self.jqGrid("getCell", rowid, "text") + "\"");
            } else if (name === "cancelMsg") {
                alert("'Cancel' button clicked in the row with id=" + rowid);
                setTimeout(function () {
                    $self.trigger("reloadGrid");
                }, 50);
            }
        }
        return true;
    }
    

    You can replace alerts inside of beforeSelectRow to the action which you need.

    0 讨论(0)
提交回复
热议问题