我有以下JSON：
{
"wrapper": {
"table": {
"rows": [
{
"cells": [
{
"fname": "Jack",
"label": "fname",
"editable": false
},
{
"lname": "Kalra",
"label": "lname",
"editable": true,
"details": [
{
"industry": "music"
},
{
"industry": "media"
}
]
}
]
},
{
"cells": [
{
"fname": "Steven",
"editable": true,
"label": "fname"
},
{
"lname": "Martini",
"editable": true,
"label": "lname"
}
]
},
{
"cells": [
{
"fname": "Andrea",
"editable": true,
"label": "fname"
},
{
"lname": "Dmello",
"editable": true,
"label": "lname",
"details": [
{
"industry": "finance"
},
{
"industry": "HR"
},
{
"industry": "media"
}
]
}
]
},
{
"cells": [
{
"fname": "James",
"label": "fname",
"editable": false
},
{
"label": "lname",
"lname": "Diamond",
"editable": true,
"details": [
{
"industry": "music"
},
{
"industry": "media"
}
]
}
]
},
{
"cells": [
{
"fname": "Aba",
"label": "fname",
"editable": true
},
{
"label": "lanme",
"lname": "Duck",
"editable": true,
"details": [
{
"industry": "finance"
},
{
"industry": "technology"
},
{
"industry": "media"
}
]
}
]
},
{
"cells": [
{
"fname": "Henry",
"label": "fname",
"editable": true
},
{
"label": "lname",
"lname": "Hebert",
"editable": true,
"details": [
{
"industry": "finance"
},
{
"industry": "HR"
},
{
"industry": "media"
},
{
"industry": "IT"
}
]
}
]
}
]
}
}
}
所有单元格均可编辑。
我正在尝试遍历每一行，然后遍历每个单元格以查找“详细信息”中的属性数量。在内联编辑模式下，它应该是文本字段，文本字段的值应该是相应的属性数。
示例 - 对于Marc Kalra，详细信息单元格将是值为2的文本字段。
这是我的代码
loadComplete: function(data){
var x, y, cellProp;
for (x = 0; x < data.wrapper.table.rows.length; x++) {
var cellCount = data.wrapper.table.rows[x].cells.length;
for (y = 0; y < cellCount; y += 1) {
cellProp = data.wrapper.table.rows[x].cells[y];
var prop, listCount, cellLabel;
listCount = data.wrapper.table.rows[x].cells[y].details.length;
cellLabel = data.wrapper.table.rows[x].cells[y].label;
function gridCustomEdit (value, options){
var el = document.createElement("input");
el.type="text";
el.value = listCount;
return el;
}
for (prop in cellProp) { if (prop === "details"){
$("#jqgrid").setColProp(cellLabel, {
editable: true,
edittype: "custom",
editoptions: {
custom_element: gridCustomEdit
}
});
}
}
}
}
问题 - 上述代码中的el.value = listCount;始终返回4作为每行/单元格的属性数。
有人能指出我的错误吗？
已更新
loadComplete: function(data){
var x, y, cellProp;
for (x = 0; x < data.wrapper.table.rows.length; x++) {
var cellCount = data.wrapper.table.rows[x].cells.length;
for (y = 0; y < cellCount; y += 1) {
cellProp = data.wrapper.table.rows[x].cells[y];
var isEditable = cellProp.editable;
if (isEditable === false) {
$("#jqgrid").setColProp(cellProp.label, {
editable: false
});
}else {
var listCount, cellLabel;
listCount = data.wrapper.table.rows[x].cells[y].details.length;
cellLabel = data.form.summary.rows[x].cells[y].label;
$("#jqgrid").setColProp(cellLabel, {
editable: true,
editoptions: {
dataInit: function(elem){
$(elem).myPlugin({listCount: listCount})
}
}
})
}
}
}
}
插件代码
(function( $ ){
$.fn.extend({
myPlugin: function(options){
var defaults = {
listCount: 0
};
var options = $.extend(defaults, options);
var o = options;
alert(o.listCount);
if (o.listCount === 3){
$(elem).html("<input type='text' value='" + o.listCount + "'>")
} else {
$(elem).html("<select>") **// this should be a dropdown with values = properties of `details`**
}
}
})
})
网格代码
$("#jqgrid").jqGrid({
datatype: "json",
colNames:['fname','lname'],
colModel:[
{name:'fname',index:'fname'},
{name:'lname',index:'lname'},
],
jsonReader: {
root: "wrapper.table.rows",
repeatitems: false
},
onSelectRow: function(id){
$(this).jqGrid('editRow',id);
},
})
如果存在details + details = 3中的属性数，则lname将以内联编辑模式显示为文本字段。
如果details存在{details＆gt;中的属性数量3，然后lname在内联编辑模式下显示为选择字段。
答案 0 :(得分：2)
方法setColProp设置列的属性，而不是列中的单元格。因此，如果您在同一列的循环setColProp中设置多次，则仅应用最后一个设置。因为数据中的最后一行（对于＆＃34; Love Hebert＆＃34;）在details数组中有4个项目，所以只会使用该值。
下一个错误是您定义了gridCustomEdit函数，该函数引用了外部变量listCount。在这种情况下，只有一个函数实例具有变量的最后一个值。如果你需要有许多具有不同值的函数实例，你应该使用闭包。
在你的情况下，在我看来，你可以实现你所需要的所有东西，即使没有使用闭包而没有custom editing（edittype:'custom' custom_element和{{1} }）
我认为您需要做的就是在custom_value内（或在setColProp的调用之前）而不是{{1}之内设置onSelectRow } 即可。有关详细信息，请参阅the answer。如果您需要更改列的editRow，则可以采用相同的方式执行此操作。因此，您可以动态设置loadComplete并将edittype设置为edittype: "text"，这会更改元素的editoptions。
如果需要，您甚至可以在dataInit和value之间动态切换edittype并设置所需的所有edittype: "text"。
在这种情况下，您将获得简单灵活的代码，根本不使用自定义编辑。