我正在使用手风琴,里面有10个网格。所以基本上我想访问手风琴中的每个网格,但不确定如何在ExtJS中完成。
示例:如果我想定位网格,我可以这样做:
Ext.ComponentQuery.query('grid');
但是,如果我使用上面的代码,它将针对UI中的所有网格,我不想这样做。我只想从我的手风琴中定位网格。
layout: {
type: 'accordion',
animate: false,
fill: false,
hideCollapseTool: false,
collapseFirst: false,
titleCollapse: false,
multi: true,
overflowHandler: 'scroller'
}
任何想法如何做到这一点?提前谢谢!
答案 0 :(得分:0)
第一件事
accordion
不是xtype
。
Accordion是一种以可扩展的手风琴风格管理多个Panel的布局,默认情况下,在任何给定时间只能扩展一个Panel。
因为您只想从
中定位网格accordian
如果您已创建自定义xtype:'accordion'
,那么me.down('accordion').query('grid')
如果me
包含xtype:'accordion'
,则可以这样//create grid
Ext.define('DemoGrid', {
extend: 'Ext.grid.Panel',
xtype: 'demogrid',
store: {
fields: ['name', 'email', 'phone'],
data: [{
name: 'Lisa',
email: 'lisa@simpsons.com',
phone: '555-111-1224'
}, {
name: 'Bart',
email: 'bart@simpsons.com',
phone: '555-222-1234'
}, {
name: 'Homer',
email: 'homer@simpsons.com',
phone: '555-222-1244'
}, {
name: 'Marge',
email: 'marge@simpsons.com',
phone: '555-222-1254'
}]
},
columns: [{
text: 'Name',
dataIndex: 'name'
}, {
text: 'Email',
dataIndex: 'email',
flex: 1
}, {
text: 'Phone',
dataIndex: 'phone'
}],
flex: 1
});
//controller
Ext.define('DemoCnt', {
extend: 'Ext.app.ViewController',
alias: 'controller.demo',
onButtonClick: function (button) {
var accordion = this.lookupReference('demoAccordion'); //if your Accordion Layout is inside of panel/coantainer then you can use like this {this.lookupReference(your refrence name)}.
this.doGetAllGrid(accordion);
/* var panel = button.up('panel');
panel.down('[reference=demoAccordion]');
panel.down('panel') also we get like this
panel.down('panel[reference=demoAccordion]') also we get like this
*/
},
doGetAllGrid: function (accordion) {
var data = [];
//{accordion.query('grid')} return all grid as Accordion contain
Ext.Array.forEach(accordion.query('grid'), function (item) {
data.push('<b>' + item.title + '</b>');
});
Ext.Msg.alert('Success', 'Your all grid title is below :-<br>' + data.join('<br>'));
}
});
//Accordion Layout panel
Ext.create('Ext.panel.Panel', {
title: 'Accordion Layout',
width: '100%',
controller: 'demo',
height: 700,
items: [{
xtype: 'panel',
reference: 'demoAccordion',
layout: {
// layout-specific configs go here
type: 'accordion',
animate: false,
fill: false,
hideCollapseTool: false,
collapseFirst: false,
titleCollapse: false,
// multi: true,
overflowHandler: 'scroller'
},
defaults: {
xtype: 'demogrid'
},
items: [{
title: 'Grid 1'
}, {
title: 'Grid 2'
}, {
title: 'Grid 3'
}, {
title: 'Grid 4'
}, {
title: 'Grid 5'
}, {
title: 'Grid 6'
}, {
title: 'Grid 7'
}, {
title: 'Grid 8'
}, {
title: 'Grid 9'
}, {
title: 'Grid 10'
}],
}, {
xtype: 'demogrid',
margin:'10 0',
title: 'Grid 11 will not inside of Accordion Layout '
}],
buttons: [{
text: 'Get All Grid',
height: 50,
padding: '0 35',
style: 'background: transparent;border: 2px solid #737373cc;',
handler: function () {
var panel = this.up('panel');
panel.getController().doGetAllGrid(panel.down('[reference=demoAccordion]')); //Just call only common method of controller to get all grid.
}
}, {
text: 'Get All using controller method with a reference',
height: 50,
padding: '0 35',
style: 'background: transparent;border: 2px solid #737373cc;',
handler: 'onButtonClick'
}],
renderTo: Ext.getBody()
});
。
如果您已定义reference,那么您可以使用控制器或lookupReference使用视图来获得此lookupReference。
我在这里创建了一个小型sencha fiddle演示。希望这会对你有所帮助。
function f = hist2dw(x,y,weights,xedges,yedges)
%all inputs should be vectors
[~,xbin] = histc(x,xedges);
[~,ybin] = histc(y,yedges);
xbin(xbin==0) = inf;
ybin(ybin==0) = inf;
xnbin = numel(xedges);
ynbin = numel(yedges);
xy = xbin * ynbin + ybin;
[xyu,id] = unique(xy);
xyu(end) = []; % remove Inf bin
id(end) = [];
hstres = histc(xy,xyu);
hstres = hstres.*weights(id); % add the weights to the histogram
f(ynbin,xnbin)=0; % preallocate memory
f(xyu-ynbin) = hstres;