javascript - 如何在页面加载时显示可编辑的 jqgrid 列

Question

我正在开发 JQgrid，其中有 2 列需要可编辑，我已经使用 colModel 中的以下选项实现了它。

{
  name: 'Action',
  index: 'Action',
  editable: true,
  edittype: "select",
  formatter: 'select',
  editoptions: {
    value: {
      1: 'Approve',
      2: 'Reject'
    }
  },
  editrules: {
    required: true,
    custom: true,
    custom_func: actionCheck
  }
},

以及下面jqgrid中的两个选项

cellEdit: true,
cellsubmit: 'clientArray',

但是这样，我必须单击该列才能对其进行编辑。

我还有一个名为 comments 的列，其中包含 edittype:"textarea"。

我想要的是，当用户打开页面时，他们会在所有行的两列中看到下拉菜单和文本区域，当他们在输入数据后单击提交按钮时，我会将所有内容抓取到一个数组中，然后使用它更新我的 SharePoint 列表。

这可能吗？如果是这样，请告诉我如何做。

这是我目前拥有的，

Answer 1

使用 celEdit 你不能做你想做的事。您可以使用 editRow 和 saveRow 这两种方法。请为此目的检查文档。

这个想法是在数据加载后调用editRow。这可以在 jqGrid 代码之后使用 setTimeout 函数来完成。使这两个字段可编辑并执行。

...
jqGrid({
...
});

setTimeout(function() {
    var grid = $("#jqGrid");
    var ids = grid.jqGrid('getDataIDs');

    for (var i = 0; i < ids.length; i++) {
        grid.jqGrid('editRow',ids[i]);
    }
}, 800);

之后您可以通过单击按钮保存数据。该按钮应该在 DOM 中的某个位置定义。

    function saveRows() {
        var grid = $("#jqGrid");
        var ids = grid.jqGrid('getDataIDs');

        for (var i = 0; i < ids.length; i++) {
            grid.jqGrid('saveRow', ids[i]);
        }
    }

请查看类似example here