我很新的ExtJS的,并希望实现以下目标:
我有一个数据是这样一种模式:
{
"Account_Enabled": true,
"Requirements_gathered": true,
"work_done": false,
"deadlines": {
"Account_Enabled": true,
"Requirements_gathered": false
}
}
有没有多行。只有一行从数据库返回。
我想有三列列1显示在网格中的数据:一个复选框,显示值是否是真还是假栏3:列列2名的复选框,显示是否出现在“最后期限”列名或不
例如:
Account_Enabled真真
Requirements_Gathered对错
work_done假未定义(复选框需要禁用)
基本上,我需要到一个行转换成三列。此外,我需要更新商店当用户检查/ uncheks复选框
可我知道,如果有任何的方式通过ExtJS的电网来实现这一目标?或者是有什么更好的主意吗?
提前致谢
有绑定在你提到的网格储存格式的JSON响应的直接方式。
什么,你需要做的是操纵所需要的匹配网格列的响应。
检查该工作示例ExtJs Fiddle
//Your Original Response
let response = '{"Account_Enabled": true, "Requirements_gathered": true, "work_done": false, "deadlines": {"Account_Enabled": true, "Requirements_gathered": false}}';
// Convert your response to object
let jsonDecode = Ext.decode(response);
//This function to convert your response to match grid store
let dataConvert = function(jsonObj){
//Returned array object
let data = [];
// To get Object of deadlines and know if the property exist or not
let availableData = jsonObj.deadlines
//Loop throw object property
for(var objProperty in jsonObj){
//Ignore deadlines property
if(objProperty=="deadlines"){
continue;
}
//Adding the object to the array "objPropery" will return the property name
//"jsonObj[objProperty]" will return the value of property if it is true or flase
//"availableData[objProperty]" will return the value if exist in availableData
data.push({colName:objProperty,isReqGathered:jsonObj[objProperty],isWorkDone:availableData[objProperty]})
}
return data
}
let gridStore = Ext.create('Ext.data.Store', {
storeId: 'gridStoreId',
fields: ['colName', 'isReqGathered', 'isWorkDone'],
data: dataConvert(jsonDecode)
});
Ext.create('Ext.grid.Panel', {
title: 'Test Store Filter',
width: 500,
height: 400,
renderTo: Ext.getBody(),
store: gridStore,
columns: [{
dataIndex: 'colName',
text: 'colName'
}, {
dataIndex: 'isReqGathered',
text: 'isReqGathered'
}, {
dataIndex: 'isWorkDone',
text: 'isWorkDone'
}]
})