У моего приложения есть виджет с выпадающим списком (на первой панели инструментов сетки) и двумя сетками.Фильтрация сетки с элементом combobox
При выборе элемента combobox отправляется дополнительный параметр на сервер, а первая сетка загружается, фильтруется в соответствии с этим дополнительным параметром.
Когда я выбираю одну строку первой сетки, отправляется дополнительный параметр на сервер (запись id_pater), а вторая сетка загружается, фильтруется в соответствии с этим дополнительным параметром.
Фильтр должен быть выполнен на стороне сервера (я использую PHP).
Если я последовательно выбираю различные элементы в поле со списком, первая сетка загружается правильно;
Если тогда я выбираю один из первых строк сетки, то вторая сетка загружается должным образом.
Проблема:
После выбранного элемента поля со списком, если выбрать строку из первой сетки, а затем я снова перейти на выпадающий список, и я выбираю с различным элементом, сетки маски нагрузки работать бесконечно, и появляется следующее сообщение об ошибке:
Uncaught TypeError: Cannot read property 'get' of undefined
инструменты для разработчиков Chrome означает, что ошибка возникает в следующей строке кода:
var id_pater = records[0].get('id_pater');
Я пробовал все, чтобы разрешить эту ошибку, но я до сих пор не могу решить или понять, что на самом деле вызывает эту ошибку.
Любая идея, как решить эту проблему?
Заранее спасибо.
//=======GRID PATER - first grid =========
Ext.define('APP.GridPater',{
extend: 'Ext.grid.Panel',
alias : 'widget.gridpater',
requires: [
'Ext.grid.*',
'Ext.data.*'
],
viewModel:{
type: 'gridpaterviewmodel'
},
bind:{
store:'{storegridpater}'
},
plugins: 'gridfilters',
title: 'Subject',
layout:'fit',
margin:'0 2 0 2',
width: '60%',
border: true,
itemId: 'gridPateritemId',
autoscroll:true,
viewConfig: {
stripeRows: true,
enableTextSelection: false,
},
initComponent: function() {
var me = this;
Ext.apply(me, {
columns: [{
xtype: 'rownumberer',
minWidth:30,
},{
text : 'Pater',
flex : 1.5,
sortable : false,
dataIndex: 'pater',
hideable: false
}],
//======= combobox ============
dockedItems:[{
xtype: 'toolbar',
dock:'top',
flex: 1,
items: [{
xtype:'combobox',
name:'theme',
itemId: 'themeItemId',
fieldLabel:' Theme',
width:'100%',
padding: '0 0 0 3',
labelWidth: 32,
reorderable:false,
displayField:'theme',
valueField:'id_theme',
selectOnFocus:false,
editable:false,
enableKeyEvents:true,
queryMode: 'local',
value:'All',
bind: {
store: '{storetheme}'
},
listeners:{
select: function(combobox, records, eOpts) {
var grid = Ext.ComponentQuery.query('#gridPateritemId')[0];
var storePater = grid.getStore();
var value = combobox.getValue();
storePater.load({
params:{'filter': value},
});
}
}
}]
}]
});
me.callParent();
},
// -----------LISTENERS-----------------------
listeners: {
onSelectionChangePaterItem: function(grid, records, record, eOpts) {
var grid = Ext.ComponentQuery.query('#gridPateritemId')[0];
var storepater = grid.getStore();
var gridFilius = Ext.ComponentQuery.query('#gridFiliusItemId')[0];
var storefilius = gridFilius.getStore();
var id_pater = records[0].get('id_pater'); //PROBLEM HERE????
storefilius.load({
params:{ 'id_pater': id_pater},
//select first gridFilius row
//callback: function(records, operation, success) {
//gridFilius.getView().getSelectionModel().select(0);
// },
scope: this
});
}
}
});
//==== GRID FILIUS - second grid ================
Ext.define('APP.GridFilius',{
extend: 'Ext.grid.Panel',
alias : 'widget.gridfilius',
requires: [
'Ext.grid.*',
'Ext.data.*'
],
viewModel:{
type: 'gridfiliusviewmodel'
},
bind:{
store:'{storegridfilius}'
},
title: 'Filius',
layout:'fit',
margin:'0 2 0 2',
width: '60%',
border: true,
itemId: 'gridFiliusitemId',
autoscroll:true,
viewConfig: {
stripeRows: true,
enableTextSelection: false,
},
initComponent: function() {
var me = this;
Ext.apply(me, {
columns: [{
xtype: 'rownumberer',
minWidth:30,
},{
text : 'Filius',
flex : 1.5,
sortable : false,
dataIndex: 'filius',
hideable: false
}]
});
me.callParent();
}
});