jqGrid-JSON响应中的内联编辑逻辑 [英] jqGrid - inline editing logic in JSON response

问题描述

是否可以在原始数据JSON响应中进行内联编辑?

Is it possible to have the inline editing in the raw data JSON response?

因此，我们可以在JSON中使用"editable":"true"，而不是在Model列中使用"editable:true".

So, instead of having "editable:true" in the column Model, we could have "editable":"true" in JSON and it would work the same way.

我想做什么-

What I want to do --

当我单击一行时，可以内联编辑该行.而且，可编辑"属性根本不是在列模型中设置的，而是通过JSON传递的.列在加载时不应该是可编辑的，只有单击事件才能触发内联编辑.

When I click on a row, I can inline edit that row. And the "editable" property is not at all set in the column model, but coming through JSON. The columns should not be editable on load, it's only the click event that would fire inline editing.

我有以下 JSON

{
    "rows":[
        {
            "id":"1",
            "editable":"true",
            "cell":[                
                "Column 1 Data",
                "Column 2 Data"

            ]
        },
        {
            "id":"2",
            "editable":"false",
            "cell":[                
                "Column 1 Data",
                "Column 2 Data"

            ]
        }
]}

在这种情况下，不同的表单字段将如何工作-输入字段，文本区域和选择字段?

How will the different form fields work in this case - input field, textarea and select field?

推荐答案

这是一个有趣的问题！是的，您可以这样做.在loadComplete回调内部，您可以访问作为loadComplete参数的数据(将JSON响应转换为对象).您可以发布有关行的信息，应在加载数据后直接在内联编辑模式下设置这些行的信息.例如，应该是rowid和可以编辑的列名.您可以使用setColProp方法(请参阅以修改列的editable属性并调用editRow方法.通过这种方式，您可以完全实现所需的一切.

It's interesting question! Yes, you can do this. Inside of loadComplete callback you have access to the data (JSON response converted to the object) which is the parameter of loadComplete. You can post the information about the rows, which should be set in inline editing mode directly after loading of the data. For example is should be rowids and the column names which can be edited. You can use setColProp method (see here) or getColProp (see here) to modify the editable property for the columns and call editRow method. In the way you can full implement all what you need.

已更新:如果进行内联编辑，则可以在任何行上设置"not-editable-row"类，然后jqGrid将不允许编辑该行.因此，在loadComplete(data)内部，您可以枚举data.rows数组的项目，并为每个具有editable属性等于false的项目添加"not-editable-row"类.该代码可能与以下内容有关:

UPDATED: In case of inline editing you can set "not-editable-row" class on any row, then jqGrid will not allows to edit the row. So inside of loadComplete(data) you can enumerate items of the data.rows array and for every item which has editable property equal to false add "not-editable-row" class to the row. The code could be about the following:

$("#list").jqGrid({
    // ... here all your other jqGrid options
    loadComplete: function (data) {
        var item, i, l = data && data.rows ? data.rows.length : 0;
        for (i = 0; i < l; i++) {
            item = data.rows[i];
            if (item.editable === false) {
                $("#" + item.id).addClass("not-editable-row");
            }
        }
    }
});

更新2 :问题非常简单.您应该在if (item.editable === false) {上面的代码中将其修改为if (item.editable === "false") {，或者将"editable":"false"从JSON数据更改为"editable": false，这与布尔数据的JSON序列化相对应.

UPDATED 2: The problem is very easy. Either you should modify in the code above if (item.editable === false) { to if (item.editable === "false") { or change "editable":"false" from the JSON data to "editable": false which corresponds JSON serialization of boolean data.

从演示中如何查看方法的工作.

更新3 .在最新版本的jqGrid中，已实现rowattr.现在使用rowattr更为有效.有关代码示例，请参见答案.

UPDATED 3. In more recent version of jqGrid is implemented rowattr. It's much more effective to use rowattr now. See the answer for code example.

这篇关于jqGrid-JSON响应中的内联编辑逻辑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！