可编辑单元格的自定义格式化程序在 jqgrid 中选择该单元格时无法正常工作

Question

我正在使用自定义格式化程序来显示可编辑单元格的单元格数据。如果我选​​择该单元格并选择任何其他单元格，单元格数据将消失并且其他单元格变得不可编辑。如果我使用取消格式化程序也无法正常工作.

我的代码是：

jQuery("#tree").jqGrid({
    url:'json/jsonSamplePots.json',
    datatype: "json",
    mtype:'GET',
    colNames: ["id", "no.", "name"],
    colModel: [
        {name:'id',width: 30, editable:false, align:"right",sortable:false, hidden: true, key: true},
        {name:'no',width:80, editable:false, align:"left", sortable:true, sorttype:"int"},
        {name:'name', width:150, editable:true, sortable:true, sorttype:"text",formatter:resourceFormatter},
],
    rowNum:10,
    rowList:[10,20,30],
    treeGridModel:'adjacency',
    treeGrid: true,
    cellEdit: true,
    ExpandColumn:'name',
    cellsubmit : 'clientArray'});

resourceFormatter=function(cellvalue, options, rowObject)
{
var strResources='';
if( null != rowObject.name )
{
    $.each(rowObject.name,function(i,Assignment)
    {
        if(Assignment)
        {
            for(i=0;i<Assignment.length;i++)
            {
                if(i!=0)
                {
                    strResources=strResources+",";
                }

                strResources=strResources+Assignment[i].employeeName+'['+Assignment[i].assignPercent+']';
            }
        }   

    }); 
}
return strResources;}

我的 JSON 是::

{
"list": [
    {
        "id": 16731,
        "no": "1",
        "name": {
            "resources": [
                {
                    "employeeID": 103,
                    "employeeName": "Gowri",
                    "assignPercent": 100
                },
                {
                    "employeeID": 108,
                    "employeeName": "Paul",
                    "assignPercent": 50
                },
                {
                    "employeeID": 111,
                    "employeeName": "Sarfaraz",
                    "assignPercent": 50.5
                }
            ]
        }
    }
]}

Answer 1

在您的情况下，custom formatter 的选择似乎我错了。问题是自定义格式化程序不仅会在初始网格加载期间被调用，而且可以在以后调用。所以在我看来jsonmap 的用法更好：

{name: 'name', width: 250, editable: true,
    jsonmap: function (obj) {
        var prop, name = obj.name, assignment, resource, values = [], i, n;
        for (prop in name) {
            if (name.hasOwnProperty(prop)) {
                assignment = name[prop];
                if ($.isArray(assignment)) {
                    for (i = 0, n = assignment.length; i < n; i++) {
                        resource = assignment[i];
                        values.push(resource.employeeName + '[' +
                            resource.assignPercent + ']');
                    }
                }
            }
        }
        return values.join(', ');
    }}

你也必须定义jsonReader：

jsonReader: {
    repeatitems: false,
    root: "list"
}

此外，填充 TreeGrid 特定属性也很重要。您可以在beforeProcessing 回调中填充属性的一部分。在下面的示例中，我在 beforeProcessing 中填写了所有 TreeGrid 特定属性：

beforeProcessing: function (data) {
    var i, list = data.list, n, item;
    if ($.isArray(list)) {
        for (i = 0, n = list.length; i < n; i++) {
            item = list[i];
            if (typeof item.level === "undefined") { item.level = 0; }
            if (typeof item.parent === "undefined") { item.parent = null; }
            if (typeof item.isLeaf === "undefined") { item.isLeaf = false; }
            if (typeof item.expanded === "undefined") { item.expanded = false; }
            if (typeof item.loaded === "undefined") { item.loaded = true; }
        }
    }
}

你找到的修改后的demo here:

更新：我在演示中将本地 cell editing 更改为本地 inline editing，因为单元格编辑不支持使用 TreeGrid。

Answer 2

您使用的 json 有几个错误。下面试试。

{"list":{"id":16731,"no":"1","name":"resources","employeeID":116,"employeeName":"lakshmi","assignPercent":50.5},"employeeID":118,"employeeName":"abc","assignPercent":50.5}