如何使JqGrid在底部总是有空行？

我使用JqGrid进行内联编辑，不使用导航、寻呼机或页脚。我想将底部的空行添加到added。我的意思是，在编辑现有行、添加新行之后，空行将始终存在

我在loadComplete事件中添加了行，但我只是在开始时添加空行，不再添加

jQuery("#tableContents").jqGrid({
    postData: { orderId: '139358' },
    mtype: "POST",
    url: "test.asmx/GetContents",
    datatype: "json",
    ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
    serializeGridData: function (postData) {
        return JSON.stringify(postData);
    },
    jsonReader: { repeatitems: true, root: "d.rows", page: "d.page", total: "d.total", records: "d.records" },
    colNames: ['Master Content ID', 'Description Of Goods', 'No Of Items', 'Total Value for Customs', 'Weight', 'Track No'],
    colModel: [
             {
                 name: 'master_content_id', index: 'master_content_id', width: 60, hidden: true, editable: true, editrules: { edithidden: false }
             },
             {
                 name: 'content', index: 'content', width: 60, sorttype: "string", editable: true, edittype: "text",
                 editrules: {
                     required: true
                 }
             },
             {
                 name: 'piecesInt', index: 'piecesInt', width: 90, align: "right", sorttype: "int", editable: true,
                 editrules: {
                     number: true,
                     required: true
                 }
             },
             {
                 name: 'value', index: 'value', width: 100, align: "right", sorttype: "float", editable: true,
                 editrules: {
                     required: true
                 }
             },
             {
                 name: 'weight', index: 'weight', width: 80, align: "right", sorttype: "float", editable: true,
                 editrules: {
                     required: true
                 }
             },
             {
                 name: 'track_no', index: 'track_no', width: 80, align: "right", sorttype: "string", editable: true
             },
    ],
    rowNum: 10,
    rowList: [10, 20, 30],
    //pager: jQuery('#pager1'),
    sortorder: "desc",
    viewrecords: true,
    regional: 'tr',
    height : '100%',
    caption: "Manipulating Array Data",
    editurl: 'test.asmx/EditContent',
    loadonce: true,
    sortable: true,
    //footerrow: true,
    onSelectRow: function (rowid) {
        var $self = $(this),
            // savedRows array is not empty if some row is in inline editing mode
            savedRows = $self.jqGrid("getGridParam", "savedRow");
        if (savedRows.length > 0) {
            $self.jqGrid("restoreRow", savedRows[0].id);
        }
        $self.jqGrid("editRow", rowid, {    
            keys: true,
            extraparam: { orderId: '139358', staffId : '111' },
            aftersavefunc: function (rowid) {
                alert("Saved");
            }
        });
    },
    loadComplete: function () {
        var $self = $(this)
        $self.jqGrid('addRowData', undefined, {});
    }
});

---

我们怎么能做到呢

您试图以与标准行为相反的方式使用jqGrid。这是个坏主意。您必须编写大量代码，并且与标准方式的差异最小

主要问题是：jqGrid在网格内部保留数据。您尝试在数据中添加空行，该行未从服务器加载，未处于编辑模式（例如

addRow

do），且未保存在服务器上。因此，您尝试以与jqGrid逻辑相矛盾的方式使用网格。这听起来很简单，但实际上很糟糕，实现起来也很复杂

---

我建议你遵循标准的方法。您将拥有干净简单的代码，大多数用户可以直观地使用网格。例如，您可以在“添加导航器”工具栏中添加“+”/“添加”按钮，该按钮与

InlineAV

有关。用户将直观地了解添加新行需要做什么。用户单击网格底部的空行还是单击网格底部的“添加新行”按钮的区别非常小。单击按钮后，将添加新行，用户可以插入数据。按Enter键将保存行，按Esc键将删除空行。代码将很简单，并且它将执行与您现在尝试实现的几乎相同的操作

你写了“底部空行”。这还不够清楚，因为jqGrid的其他选项还不清楚。例如，您是使用高度：“自动”还是使用固定高度？你为什么想要空行？为什么不改为使用页脚？只需尝试使用

footerrow:true

。而且你发布的代码总是添加空行。因此，每次按任何列排序后，您将多出一行。这是你需要的吗？我使用高度：自动，我不在标签底部使用页脚或寻呼机。我希望底部有一个空行，以便用户可以使用该空行添加新记录。我使用内联编辑，所以当我添加“footerrow:true”时，我无法使用内联编辑编辑该页脚行。我希望空行没有排序。我仍然不理解您使用的场景。要添加新行并开始内联编辑，可以使用

addRow

。如果希望将行添加到网格底部，可以使用

position:“last”

选项。我不理解的问题是，在您的场景中，应该在何时何地调用

addRow

。我假设您尝试实现某种输入表单，并且希望用户添加新行。可能您需要禁止编辑先前在上添加的行，并设置一些其他限制。在我的网格中，我没有添加删除或保存按钮，没有寻呼机或页脚，只有coulmn页眉和行。我的场景是这样的，假设行中没有记录，应该有一个空行，以便用户可以添加他的第一行。他将单击空行以激活内联编辑，输入值，然后按Enter键保存行。行被保存，之前保存的行下再次出现一个空行，以便他可以添加第二条记录。然后，他再次选择空行以激活内联编辑，填充值并再次输入。保存第二条记录，并再次在底部添加一个新的空行。