Отношения в моделях на примере гриды.
Есть модель девайсов, среди прочих полей в ней указан массив, хранящий девайсы (будем называть их внутренними), из которых состоит основная запись.
{
data: {
deviceId: '12345',
name: 'Joystick',
devices: [{
deviceId: '1',
name: 'button1'
}, {
deviceId: '2',
name: 'button2'
}]
}
}
Есть соответствующий стор и грида, которая показывает параметры девайса, кроме внутренних девайсов, нужно сделать так, чтобы при клике на кнопку у гриды появлялся ещё один грид, который уже будет отображать внутренние девайсы. Вот ссылка на пример: https://fiddle.sencha.com/#fiddle/feb Собственно, как сделать, чтобы уже полученные нами данные могли отобразиться во второй гриде? Нужно использовать эти же модели и сторы или нужны другие или они вообще не нужны? Возможно, здесь нужно описать отношения в модели (один ко многим), я их не очень хорошо понимаю, поэтому буду рад пояснениям и по этому вопросу тоже. P.S.: ExtJS 5.1.0 |
то что вы описываете укладывется в дерево (Ext.data.TreeStore):
https://fiddle.sencha.com/#fiddle/fei но можно и ассоциациями сделать ..на вкус и цвет как говорится. |
Нужно именно отдельной гридой.
|
оно?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test</title>
<link href="http://docs.sencha.com/extjs/4.2.2/extjs-build/resources/css/ext-all-gray-debug.css" rel="stylesheet"/>
<script src="http://docs.sencha.com/extjs/4.2.2/extjs-build/ext-all.js"></script>
<script>
Ext.onReady(function () {
var dev = Ext.create('Ext.data.Store', {
fields:['deviceId', 'name'],
data: [],
proxy: {
type: 'memory',
reader: {
type: 'json'
}
}
});
Ext.create('Ext.data.Store', {
storeId:'simpsonsStore',
fields:['name', 'email', 'phone', 'obj'],
data:{'items':[
{ 'name': 'Lisa', "email":"lisa@simpsons.com", "phone":"555-111-1224", "obj": [{ deviceId: '1', name: 'button1'}, { deviceId: '2', name: 'button2'}] },
{ 'name': 'Bart', "email":"bart@simpsons.com", "phone":"555-222-1234", "obj": [{ deviceId: '1', name: 'button3'}, { deviceId: '2', name: 'button5'}] },
{ 'name': 'Homer', "email":"home@simpsons.com", "phone":"555-222-1244", "obj": [{ deviceId: '1', name: 'button4'}, { deviceId: '2', name: 'button7'}] },
{ 'name': 'Marge', "email":"marge@simpsons.com", "phone":"555-222-1254", "obj": [{ deviceId: '1', name: 'button5'}, { deviceId: '2', name: 'button9'}] }
]},
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'items'
}
}
});
Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [
{ text: 'Name', dataIndex: 'name' },
{ text: 'Email', dataIndex: 'email', flex: 1 },
{ text: 'Phone', dataIndex: 'phone' }
],
height: 200,
width: 400,
renderTo: Ext.getBody(),
listeners: {
select: function (ths, record, index, eOpts) {
obj = record.get('obj');
dev.loadData(obj);
Ext.create('Ext.window.Window', {
title: 'Hello',
autoShow: true,
height: 200,
width: 400,
layout: 'fit',
items: [{
xtype: 'grid',
store: dev,
columns: [
{ text: 'dev', dataIndex: 'deviceId' },
{ text: 'name', dataIndex: 'name', flex: 1 }
]
}]
});
}
}
});
});
</script>
</head>
<body></body>
</html>
|
| Часовой пояс GMT +3, время: 15:53. |