如何在jqgrid中删除具有本地数据的行 [英] How to delete rows with local data in jqgrid

问题描述

jqGrid参数loadonce:使用true

jqGrid parameter loadonce: true is used

选择行并按Delete键

Selecting rows and pressing delete button

未设置网址

如何仅删除本地数据中的行并取消显示此错误消息? 是否可以设置一些虚拟网址或任何其他允许行删除的想法? 如果添加和编辑表单也可以与本地数据一起使用，那就太好了.

How to delete rows in local data only and suppress this error message ? Is it possbile to set some dummy url or any other idea to allow row delete? It would be nice if add and edit forms can be used also with local data.

            url: 'GetData',
            datatype: "json",
            multiselect: true,
            multiboxonly: true, 
            scrollingRows : true,
            autoencode: true,
            loadonce: true, 
            prmNames:  {id:"_rowid", oper: "_oper" }, 
            rowTotal: 999999999,
            rownumbers: true,
            rowNum: 999999999,

更新1

从Oleg的答案中，我了解以下解决方案:

From Oleg answer I understood the following solution:

1. 禁用jqGrid标准删除按钮
2. 向工具栏添加新的删除按钮.

3. 通过此按钮，单击提供的事件调用

1. Disable jqGrid standard delete button
2. Add new delete button to toolbar.

3. From this button click event call provided

grid.jqGrid('delGridRow'，rowid，myDelOptions);

grid.jqGrid('delGridRow', rowid, myDelOptions);

方法. 可以选择多行.如何删除所有选定的行，此示例仅删除一个?

method. Multiple rows can selected. How to delete all selected rows, this sample deletes only one ?

更改jqGrid以便删除，编辑，添加按钮不使用url更好吗?当前，需要传递虚拟url，该url始终会在本地数据编辑中返回成功.

Is'nt it better to change jqGrid so that delete, edit, add buttons work without url ? Currently it is required to pass dummy url which returns success always for local data editing.

推荐答案

您可以使用 delRowData 方法不会删除任何本地行.

You can use delRowData method do delete any local row.

您可以使用 delGridRow 表单编辑(如果需要).我在此处，用于格式化程序:操作"(请参见此处，此处，最初是

You can do use delGridRow from the form editing if you need it. I described the way here and used for formatter:'actions' (see here, here and originally here).

var grid = $("#list"),
    myDelOptions = {
        // because I use "local" data I don't want to send the changes
        // to the server so I use "processing:true" setting and delete
        // the row manually in onclickSubmit
        onclickSubmit: function(options, rowid) {
            var grid_id = $.jgrid.jqID(grid[0].id),
                grid_p = grid[0].p,
                newPage = grid_p.page;

            // reset the value of processing option which could be modified
            options.processing = true;

            // delete the row
            grid.delRowData(rowid);
            $.jgrid.hideModal("#delmod"+grid_id,
                              {gb:"#gbox_"+grid_id,
                              jqm:options.jqModal,onClose:options.onClose});

            if (grid_p.lastpage > 1) {// on the multipage grid reload the grid
                if (grid_p.reccount === 0 && newPage === grid_p.lastpage) {
                    // if after deliting there are no rows on the current page
                    // which is the last page of the grid
                    newPage--; // go to the previous page
                }
                // reload grid to make the row from the next page visable.
                grid.trigger("reloadGrid", [{page:newPage}]);
            }

            return true;
        },
        processing:true
    };

然后使用

grid.jqGrid('delGridRow', rowid, myDelOptions);

已更新:对于multiselect: true，可以将myDelOptions修改为以下内容:

UPDATED: In case of multiselect: true the myDelOptions can be modified to the following:

var grid = $("#list"),
    myDelOptions = {
        // because I use "local" data I don't want to send the changes
        // to the server so I use "processing:true" setting and delete
        // the row manually in onclickSubmit
        onclickSubmit: function(options) {
            var grid_id = $.jgrid.jqID(grid[0].id),
                grid_p = grid[0].p,
                newPage = grid_p.page,
                rowids = grid_p.multiselect? grid_p.selarrrow: [grid_p.selrow];

            // reset the value of processing option which could be modified
            options.processing = true;

            // delete the row
            $.each(rowids,function(){
                grid.delRowData(this);
            });
            $.jgrid.hideModal("#delmod"+grid_id,
                              {gb:"#gbox_"+grid_id,
                              jqm:options.jqModal,onClose:options.onClose});

            if (grid_p.lastpage > 1) {// on the multipage grid reload the grid
                if (grid_p.reccount === 0 && newPage === grid_p.lastpage) {
                    // if after deliting there are no rows on the current page
                    // which is the last page of the grid
                    newPage--; // go to the previous page
                }
                // reload grid to make the row from the next page visable.
                grid.trigger("reloadGrid", [{page:newPage}]);
            }

            return true;
        },
        processing:true
    };

更新2 :要在删除"操作上具有键盘支持并将删除"按钮设置为默认值，您可以添加delSettings附加选项

UPDATED 2: To have keyboard support on the Delete operation and to set "Delete" button as default you can add in the delSettings additional option

afterShowForm: function($form) {
    var form = $form.parent()[0];
    // Delete button: "#dData", Cancel button: "#eData"
    $("#dData",form).attr("tabindex","1000");
    $("#eData",form).attr("tabindex","1001");
    setTimeout(function() {
        $("#dData",form).focus(); // set the focus on "Delete" button
    },50);
}

这篇关于如何在jqgrid中删除具有本地数据的行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！