我代码中有一个网格面板:
Ext.create('Ext.grid.Panel', {
id : 'frPanel-' + interfaceId,
store : frStore,
columns : [
{
text : 'Sequence',
dataIndex : 'ruleId',
menuDisabled : true
},
{
text : 'Source',
dataIndex : 'source',
renderer : function(value, metaData) {
var newValue = convertObjValue(value);
if (newValue.match(/[-]+/i)) {
metaData.tdAttr = 'data-qtip="'
+ networkStore(value) + '"';
}
return newValue;
}
},
// paging bar at the bottom
dockedItems : [ {
xtype : 'pagingtoolbar',
store : frStore, // same store GridPanel is using
dock : 'bottom',
displayInfo : true
} ],
height : 300,
width : '100%',
forceFit : true,
renderTo : 'frContainer-' + interfaceId
});
以下是我拥有的辅助函数:
// To get the value after 2nd colon for object and object-group
function convertObjValue(value) {
var result;
var exp = /.*?:.*?:(.*)/i;
var newValue = value;
if ((result = exp.exec(value)) != null) {
if (result.index === exp.lastIndex) {
exp.lastIndex++;
}
newValue = result[1];
}
return newValue;
}
商店:
function networkStore(value) {
//var store = Ext.create('Ext.data.Store', {
var store = new Ext.data.Store({
model : 'networkModel',
autoLoad : {
timeout : 60000
},
proxy : {
type : 'ajax',
url : networkObjsURL + "&" + Ext.urlEncode({
'peId' : value
}),
reader : {
type : 'json',
idProperty : 'objValue'
},
}
});
var hoverOutput = "";
if(store.data.length > 0){
store.data.items.forEach(function(item) {
hoverOutput += item.data.objectValue + "</br>";
});
}
console.log(hoverOutput);
return hoverOutput;
最后但同样重要的是模型:
Ext.define('networkModel', {
extend : 'Ext.data.Model',
fields : [ {
name : 'objectValue'
} ]
});
现在有一个问题。问题是,如果我在浏览器的store中不放置断点,则值不会显示在qtip中。我猜这是因为grid panel在ajax响应后没有等待store响应返回。有人可以帮我找到解决此情况的方法吗?
谢谢提前。
render
函数中创建存储(直接在networkStore
中多次创建)?尽管如此,存储正在异步获取数据。所以你必须等待/回调结果(或者例如使用Future/Promise API)。此外,你应该在frStore
存储中拥有网格所需的任何必要数据(你将其传递给网格)。你可以利用模型中的数据关联,这样你就可以在模型中创建新字段或者只是在render
函数中使用该关联。 - rzymek