jqgrid - jqgrid中的两种不同的编辑形式

Question

有没有办法在 jqGrid 中实现 2 种不同的编辑表单。我的意思是一个普通的常用编辑表单，另一个具有较小的表单字段（自定义）。两者都在同一个导航网格中。说编辑和部分编辑。任何人都可以发光吗？非常感谢。

Answer 1

navGrid通过调用两个editGridRow方法添加的按钮“添加”和“编辑”，具有不同的参数作为第二个参数（properties参数）。如果使用navGrid称为

$("#grid").jqGrid("navGrid", "#pager", {parameters}, prmEdit, prmAdd);

然后navGrid打电话

$("#grid").jqGrid("editGridRow", rowid, prmEdit);

如果用户单击“编辑”按钮并调用

$("#grid").jqGrid("editGridRow", rowid, prmAdd);

如果用户单击“添加”按钮。

以同样的方式，您可以根据navButtonAdd方法向导航器添加新的自定义按钮。例如

$("#grid").jqGrid("navButtonAdd", "#pager", {
    caption: ""/*"My Edit"*/,
    buttonicon: "ui-icon-note", // some icon
    title: "My edit",
    onClickButton: function() {
        var $self = $(this);
        $self.jqGrid("editGridRow",
            $self.jqGrid("getGridParam", "selrow"),
            { // some options
                recreateForm: true
            }
        );
    }
});

在您添加一个编辑按钮的方式。您现在唯一需要做的就是在调用 of 之前临时更改editable某些列的属性，并在调用 ofeditGridRow之后将其重置为原始值editGridRow。您可以使用setColProp方法来简化工作。例如，如果您想使myColumn列可编辑，您可以使用

$("#grid").jqGrid("navButtonAdd", "#pager", {
    caption: ""/*"My Edit"*/,
    buttonicon: "ui-icon-note", // some icon
    title: "My edit",
    onClickButton: function() {
        var $self = $(this);
        // make "myColumn" temporary editable
        $self.jqGrid("setColProp", "myColumn", {editable: true});
        $self.jqGrid("editGridRow",
            $self.jqGrid("getGridParam", "selrow"),
            { // some options
                recreateForm: true
            }
        );
        // make "myColumn" back as non-editable
        $self.jqGrid("setColProp", "myColumn", {editable: false});
    }
});

我想强调的是，对(inclusive ) 的所有用法使用recreateForm: trueoption非常重要。所以我建议你只更改选项的默认值：editGridRownavGrid

$.extend($.jgrid.edit, { recreateForm: true });