我从服务器动态获取列和存储数据,然后调用网格的方法重新配置(store,col)。每列都有自己的uniq数据索引,但RowEditing无法正常工作。
这样的结果是在改变数据的过程中获得的,数据仅在3列中改变,其余的仍然存在。如果选择任何其他表,通常无法在更新后更改数据,则不清楚它取决于什么。
CODE SNIPPET
Ext.define('MVC.view.Main', {
show: function() {
var store = Ext.create('Ext.data.Store', {
fields: ['HeadClue', 'Density', 'errDens', 'MethodD', 'bknumber', '_methodD'],
autoLoad: false,
proxy: {
type: 'ajax',
method: 'get',
url: 'rest/table/density',
reader: {
type: 'json',
root: 'data',
totalProperty: 'total'
},
paramsAsJson: true
}
});
var col = [];
var rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
clicksToMoveEditor: 1,
autoCancel: false
});
var contentPanel = Ext.create('Ext.grid.Panel', {
title: 'Таблица',
region: 'center',
store: store,
columns: col,
bbar: Ext.widget('pagingtoolbar', {
store: store,
displayInfo: true,
displayMsg: 'Данных {0} - {1} of {2}'
}),
plugins: [rowEditing],
tbar: [{
text: 'Добавить новую запись',
handler: function() {
rowEditing.cancelEdit();
var prev = store.data.items[0].data;
var newRow = {};
for (var property in prev) {
if (prev.hasOwnProperty(property)) {
newRow[prev[property]] = null;
}
}
store.insert(0, newRow);
rowEditing.startEdit(0, 0);
}
}, {
text: 'Обновить данные',
handler: function() {
store.reload();
}
}, {
text: 'Сохранить изменения',
handler: function() {}
}, {
text: 'Удалить запись',
handler: function() {
var sm = contentPanel.getSelectionModel();
rowEditing.cancelEdit();
store.remove(sm.getSelection());
if (store.getCount() > 0) {
sm.select(0);
}
}
}, '->', {
xtype: 'triggerfield',
trigger1Cls: Ext.baseCSSPrefix + 'form-clear-trigger',
trigger2Cls: Ext.baseCSSPrefix + 'form-search-trigger'
}]
});
var treePanel = Ext.create('Ext.tree.Panel', {
id: 'tree-panel',
title: 'Категории базы данных',
region: 'north',
height: '100%',
minSize: 150,
rootVisible: false,
autoScroll: true,
root: {
expanded: true,
children: [{
text: "Акустооптические свойства",
leaf: true,
entity: 'Acop'
}, {
text: "Область гомогенности соединения",
leaf: true,
entity: 'Sist'
}, {
text: "Теплоемкость",
leaf: true,
entity: 'Heat'
}, {
text: "Плотность",
leaf: true,
entity: 'Density'
}, {
text: "Пьезоэлектрические коэффициенты",
leaf: true
}, {
text: "Твердость",
leaf: true
}, {
text: "Растворимость",
leaf: true
}, {
text: "Температура плавления",
leaf: true
}, {
text: "Температура Кюри",
leaf: true
}, {
text: "Данные по полиморфным модификациям",
leaf: true
}, {
text: "Параметры элементарной ячейки",
leaf: true
}, {
text: "Тепловое расширение",
leaf: true
}, {
text: "Теплопроводность",
leaf: true
}, {
text: "Диэлектрическая проницаемость",
leaf: true
}, {
text: "Диэлектрические потери",
leaf: true
}, {
text: "Коэффициенты электромеханической связи",
leaf: true
}, {
text: "Упругие жесткости (податливости)",
leaf: true
}, {
text: "Область оптической прозрачности",
leaf: true
}, {
text: "Показатели преломления",
leaf: true
}, {
text: "Коэффициенты Селмейера",
leaf: true
}, {
text: "Электрооптические коэффициенты",
leaf: true
}, {
text: "Нелинейно-оптические коэффициенты",
leaf: true
}, {
text: "Компоненты тензора Миллера",
leaf: true
}, {
text: "Упруго(пьезо)оптические коэффициенты",
leaf: true
}, {
text: "Коэффициенты затухания упругих волн",
leaf: true
}, {
text: "Подписи к рисункам",
leaf: true
}]
}
});
treePanel.getSelectionModel().on('select', function(selModel, record) {
if (record.get('leaf')) {
Ext.Ajax.request({
url: 'rest/table/columns',
params: {
entity: record.get('entity')
},
method: 'GET',
success: function(response) {
col = JSON.parse(response.responseText);
col.forEach(function(item) {
item.editor = {
allowBlank: true
}
});
store.proxy.url = 'rest/table/';
store.on('load', function(st) {
contentPanel.reconfigure(store, col);
});
store.load({
params: {
entity: record.get('entity')
}
});
}
});
}
});
var viewport = Ext.create('Ext.Viewport', {
layout: 'border',
title: ' Панель работы с БД',
style: 'background: #efefe8',
items: [{
xtype: 'box',
id: 'header',
region: 'north',
html: '<h1> Панель работы с БД</h1>',
height: 50
}, {
layout: 'border',
id: 'layout-browser',
region: 'west',
border: false,
split: true,
margins: '2 0 5 5',
width: 290,
minSize: 100,
maxSize: 500,
items: [treePanel]
},
contentPanel
],
renderTo: Ext.getBody()
});
viewport.show();
}
});
传入数据:列
存储