带有inlineNav的jqGrid:有没有办法强制Add按钮重新启用?

时间:2012-06-04 18:58:09

标签: jquery jqgrid

我正在使用带有inlineNav选项的jqGrid 4.3.2。网格上的所有编辑都是使用loadonce: trueclientArray在本地完成的。当用户完成编辑时,他们单击表单上的保存按钮,整个网格将发布到服务器。这在大多数情况下效果很好,但我遇到了一个奇怪的问题。如果用户添加新行然后单击保存按钮,然后按Enter键以确认编辑或取消选择新添加的行,则即使在发布和重新加载之前调用saveRow之后,内联导航器中的添加按钮仍将保持禁用状态。我在resetSelection电话后尝试了restoreRowsaveRow,但这些都没有奏效。我的保存代码:

$("#submitButton").click(function () {
    $("#theGrid").jqGrid('saveRow', $("#selectedRowId").val(), false, 'clientArray');
    if (!ValidateGridData())
        return false;
    var rowData = $("#theGrid").jqGrid('getRowData');
    var dataToSend = JSON.stringify(rowData);
    $.ajax({
        url: '@Url.Action("UpdateGridData")',
        type: 'POST',
        contentType: 'application/json; charset=utf-8',
        data: dataToSend,
        dataType: 'json',
        async: false,
        success: function (data, textStatus, jqXHR) {
            $("#theGrid").jqGrid('setGridParam', { datatype: 'json' });
            $("#theGrid").trigger('reloadGrid');
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert('Error saving data: ' + textStatus + " " + errorThrown);
        }
    });
    return true;
});

有没有办法可以说服内联导航器保存新行,用户可以添加更多行?

1 个答案:

答案 0 :(得分:5)

inlineNav方法在导航器中添加的按钮具有由网格ID和相应后缀构成的ID:

  • 添加:gridId +“_ iladd”(例如“list_iladd”)
  • 编辑:gridId +“_iledit”(例如“list_iledit”)
  • 保存:gridId +“_ ilave”(例如“list_ilsave”)
  • 取消:gridId +“_ ilcancel”(例如“list_ilcancel”)

要启用该按钮,您应删除'ui-state-disabled' CSS类:

var gridId = "list";
$("#" + gridId + "list_iladd").removeClass('ui-state-disabled');

要停用按钮,可以使用.addClass('ui-state-disabled')代替。

此外,我不建议您直接使用任何内联编辑方法,例如saveRow。在这种情况下,您可能不会遇到您尝试解决的问题。查看the answer中的代码。它将editingRowIdmyEditParam定义为

var $grid = jQuery("#list"),
    editingRowId,
    myEditParam = {
        keys: true,
        oneditfunc: function (id) { editingRowId = id; },
        afterrestorefunc: function (id) { editingRowId = undefined; }
    };

然后将inlineNavmyEditParam参数一起使用:

$grid.jqGrid('inlineNav', '#pager',
    { edit: true, add: true, editParams: myEditParam,
        addParams: {addRowParams: myEditParam } });

在这种情况下,您可以确保editingRowId获取当前编辑行的ID,如果没有编辑行,则undefined。因此,您可以使用$(gridIdSelector + "_iledit").click();代替editRow来编辑当前选定的行。同样,如果需要,您可以使用setSelection并模拟点击任何其他内联编辑导航按钮。

更新:如果您需要,您仍然可以在saveRow内合并onSelectRow的来电,但您可以先使用变量editingRowId并使用秒{对于您使用的所有编辑方式,{1}} common

myEditParam

如果您需要其他内联编辑方法选项,可以在onSelectRow: function (id) { var $this = $(this); if (editingRowId !== id) { if (editingRowId) { // save or restore currently editing row $this.jqGrid("saveRow", editingRowId, myEditParam); // or $this.jqGrid("restoreRow", editingRowId, myEditParam); } $this.jqGrid("editRow", editingRowId, myEditParam); } } 中添加。您会看到myEditParam更好地用作editingRowId变量,您可以在大多数内联编辑示例中找到它。