我是jqGrid的新手。我正在尝试实现一个jqGrid，其中填充了REST调用返回的数据和几个复选框，用户可以编辑这些复选框以使用另一个休息调用将新对象上载到数据库。我在填充网格时遇到了麻烦。
我遇到的问题是网格似乎占据了页面上的垂直空间，但没有显示任何信息。当我只有一个没有数据的网格时，网格的标题显示正常。
在使用Chrome进行调试期间，我发现在控制台中进行评估时，我希望从行对象返回的属性不存在，即。它们未定义。
以下是我正在使用的代码：
var RGrid = [];
$.ajax({
url: restApi + EndPoint + '/' + Number,
type: 'GET',
success: function (response) {
Object2 = response;
var rData = $('#ResGrid').jqGrid().getRowData();
for (var i = 0; i < Object2.Requests.length; i++) {
var existingRows = rData.filter(function (a) {
return a.rId == Object2.Requests[i].Resource.Id;
});
if (existingRows.length == 0) {
var newObj = {
a: Object2.Requests[i].Resource.Name,
e: Object2.Requests[i].Resource.Id,
f: Object2.Requests[i].Id,
d: false,
b: false,
c: false
};
RGrid.push(newObj);
$('#ResGrid').jqGrid('addRowData', 1, newObj);
}
}
},
error: function (textStatus) {
Error('We were unable to retrieve the item');
}
});
$('#ResGrid').jqGrid({
defaults: {
emptyrecords: "No items assigned",
loadtext: "Loading..."
},
data: RGrid,
autowidth: true,
datatype: "local",
colModel: [
{ label: 'a', name: 'a', align: 'left', editable: false },
{
label: 'b', name: 'b', align: 'center', editable: true, edittype: 'checkbox',
editoptions: { value: "True:False" },
formatter: "checkbox", formatoptions: { disabled: false }
},
{
label: 'c', name: 'c', align: 'center', editable: true, edittype: 'checkbox',
editoptions: { value: "True:False" },
formatter: "checkbox", formatoptions: { disabled: false }
},
{
label: 'd', name: 'd', align: 'center', editable: true, edittype: 'checkbox',
editoptions: { value: "True:False" },
formatter: "checkbox", formatoptions: { disabled: false }
},
{ name: 'e', hidden: true },
{ name: 'f', hidden: true }
],
rowNum: 1000,
height: 'auto',
viewrecords: true,
caption: "Desc",
grouping: false,
loadonce: true
});
我试过不传递复选框列的值和addRowData方法的几个重载，没有一个有效。奇怪的是，传递给RGrid数组的对象似乎具有我期望的所有属性 - 值对，所以我怀疑问题是使用colModel声明或我使用addRowData方法的方式。
编辑：我从服务器收到的json：
{ “ID”：4 “jobnumber可以”： “PrNum75”， “订单编号”：NULL， “QuoteNumber”： “1401291641”， “QuoteId”：33， “请”：[{ “ID”：10， “PlannedDays”：[{ “ID”：20 “时间”：4.0， “日期”： “2014-02-20T00：00：00”}]， “PlannedSkillDef”：{ “ID”：1， “描述” ：“IPE Inspector”，“DefaultRate”：200.0}，“QuoteSection”：{“Id”：54，“Description”：“Ves”，“NumberOf”：5，“TotalServices”：1000.0，“TotalConsumables”：100.0， “TotalTravel”：5.0 “TotalAmountPerVessel”：1105.0， “TravelExpenses”：[{ “ID”：26， “AgreedRate”：3.0， “数量”：1， “TravelDef”：{ “ID”：1， “描述” ：“Resource＆amp; NDT Travel”，“UnitDescription”：“Km”，“DefaultRatePerUnit”：3.0}}，{“Id”：27，“AgreedRate”：2.0，“Quantity”：1，“TravelDef”：{“ Id“：2，”Description“：”Mechanical Service Travel“，”UnitDescription“：”Km“，”DefaultRatePerUnit“：2.0}}]，”耗材“：[{”Id“：16，”Quantity“：1， “AgreedPrice”：100.0，“ConsumableDef”：{“Id”：3，“Description”：“C / MT耗材”，“UnitPrice”：100.0}}]，“服务”：[{“Id”：17 ，“ServiceDef”：{“Id”：1，“Description”：“Non Destructive Testing - Inspections”，“DefaultSkill”：{“Id”：2，“De scription“：”CPV“，”DefaultRate“：250.0}，”TasksRequired“：[{”Id“：1，”Description“：”Thickness Testing“}，{”Id“：2，”Description“：”Surface Crack测试“}，{”Id“：3，”描述“：”报告“}，{”Id“：4，”描述“：”NDT Travel“}]，”TravelDefs“：[{”Id“：1， “描述”：“资源和NDT Travel“，”UnitDescription“：”Km“，”DefaultRatePerUnit“：3.0}，{”Id“：2，”Description“：”Mechanical Service Travel“，”UnitDescription“：”Km“，”DefaultRatePerUnit“：2.0} ]，“ConsumableDefs”：[{“Id”：3，“描述”：“C / MT消费品”，“UnitPrice”：100.0}]}，“DefaultSkill”：{“Id”：70，“Rate” ：0.0， “SkillDef”：{ “ID”：2 “说明”： “CPV”， “DefaultRate”：250.0}}， “AgreedSkill”：{ “ID”：69， “费率”：250.0， “SkillDef” ：{“Id”：1，“Description”：“IPE Inspector”，“DefaultRate”：200.0}}，“ServiceTasks”：[{“Id”：92，“TaskHours”：1，“NumberOfShifts”：1，“ NumberOfStaff“：1，”ServiceTaskDef“：{”Id“：1，”Description“：”Thickness Testing“}}，{”Id“：93，”TaskHours“：1，”NumberOfShifts“：1，”NumberOfStaff“： 1，“ServiceTaskDef”：{“Id”：2，“Description”：“Surface Crack Testing”}}，{“Id”：94，“TaskHours”：1，“NumberOfShifts”：1，“NumberOfStaff”：1， “ServiceTaskDef”：{ “ID”：3， “描述”： “报告”}}，{ “ID”：95， “TaskHours”：1， “NumberOfShifts”：1， “NumberOfStaff”：1， “ServiceTaskDef”： {“Id”：4，“描述”：“NDT Travel”}}]}]}，“资源”：{“Id”：1，“ADUserName”：“###”，“名称”：“Matth ew Smith“，”SkillDefs“：[]}，”ServiceDef“：{”Id“：1，”Description“：”Non Destructive Testing - Inspections“，”DefaultSkill“：{”Id“：2，”Description“： “CPV”，“DefaultRate”：250.0}，“TasksRequired”：[{“Id”：1，“描述”：“厚度测试”}，{“Id”：2，“描述”：“表面裂缝测试”} ，{“Id”：3，“描述”：“报告”}，{“Id”：4，“描述”：“NDT Travel”}]，“TravelDefs”：[{“Id”：1，“描述” ：“资源与管理NDT Travel“，”UnitDescription“：”Km“，”DefaultRatePerUnit“：3.0}，{”Id“：2，”Description“：”Mechanical Service Travel“，”UnitDescription“：”Km“，”DefaultRatePerUnit“：2.0} ]，“ConsumableDefs”：[{“Id”：3，“描述”：“C / MT消耗品”，“UnitPrice”：100.0}]}}]，“消耗品”：[]，“TravelAllocations”：[ ]}
我感兴趣的部分是WorkRequests，我需要资源的名称和ID。
答案 0 :(得分：0)
您可以尝试在complete: function(){// here your jqgrid}中执行此操作：
“loadonce：true”无需使用此数据类型为本地
var RGrid = [];
$.ajax({
url: restApi + EndPoint + '/' + Number,
type: 'GET',
success: function (response) {
Object2 = response;
var rData = $('#ResGrid').jqGrid().getRowData();
for (var i = 0; i < Object2.Requests.length; i++) {
var existingRows = rData.filter(function (a) {
return a.rId == Object2.Requests[i].Resource.Id;
});
if (existingRows.length == 0) {
var newObj = {
a: jobObject2.Requests[i].Resource.Name,
b: jobObject2.Requests[i].Resource.Id,
c: jobObject2.Requests[i].Id,
d: false,
e: false,
f: false
};
RGrid.push(newObj);
}
}
},
error: function (textStatus) {
Error('We were unable to retrieve the item');
},
complete: function(){
$('#ResGrid').jqGrid({
defaults: {
emptyrecords: "No items assigned",
loadtext: "Loading..."
},
data: RGrid,
autowidth: true,
.........
}
});
答案 1 :(得分：0)
如果你使用datatype: "json"会更好。如果 jqGrid将向服务器发出请求。您只需使用url之类的url: restApi + EndPoint + '/' + Number选项和jsonReader之类的jsonReader: {root: "Requests", repeatitems: false}选项。它将通知jqGrid在哪里查找响应中的数据。此外，您需要使用jsonmap选项将名称为'a'，'b'，'c'，...的列绑定到属性Resource.Name以及其他服务器响应。
我非常怀疑jobObject2.Requests[i].Resource.Id和jobObject2.Requests[i].Id到'b'和'c'列formatter: "checkbox"的映射。拥有可能值仅为True或False的ID的奇怪之处。另外一个问题是在循环中使用变量Object2，但在循环体中使用了未定义的jobObject2。我认为当前代码的最小修复方法是：在success或complete回调中移动创建网格，并将jobObject2替换为Object2。我会把问题看作下一个问题。您当前的问题是：如何使用从服务器返回的数据填充网格。
我建议的代码应该看看以下内容：
$('#ResGrid').jqGrid({
datatype: "json",
url: restApi + EndPoint + '/' + Number,
gridview: true,
autoencode: true,
loadonce: true,
jsonReader: {
root: "Requests",
repeatitems: false
},
colModel: [
{ name: "a", jsonmap: "Resource.Name" },
{ name: "b", jsonmap: "Resource.Id", align: "center" },
{ name: "c", jsonmap: "Id", align: "center" }
]
...
});
更新：The demo表示上面发布的选项适用于您发布的最新版本的JSON数据。
答案 2 :(得分：0)
我已经弄清楚问题是什么。声明和填充jqGrid的代码位于一个脚本文件中，该页面在上面引用了应该充当网格的表的声明。我这是一个基本的新手错误。
谢谢大家试图帮助我，抱歉占用你的时间。猜猜是我回到C＃......