Как создать текстовое поле или текстовое поле с помощью rowbodytpl сетки extjs (rowexpander). Также моя программа должна прочитать эти поля и обновить БД. Я хотел бы знать использование радиогруппы в rowbodytpltextfield или textarea с в rowbodytpl сетки extjs (rowexpander)
1
A
ответ
0
Я думаю, что лучший способ - реализовать плагин, который может отображать любой компонент в rowbody. Затем вы можете просто передать любую конфигурацию компонента.
Пример плагина:
Ext.define('Ext.ux.grid.SubCmp', {
extend: 'Ext.grid.plugin.RowExpander',
alias: 'plugin.subcmp',
rowBodyTpl: ['{%this.owner.renderComponent(out, values);%}'],
// override this method and return component config
componentConfigFn: function(record) { return {}; },
init: function(grid) {
var me = this,
store = grid.getStore(),
view = grid.getView();
me.components = {};
me.callParent(arguments);
// when grid is reloaded we should destroy all created components
grid.on('beforedestroy', me.destroyComponents, me);
store.on('beforeload', me.destroyComponents, me);
// renders component
view.on('expandbody', me.onExpandBody, me);
// modify getRefItems method of grid to allow querying components from rowbody
grid.getRefItems = (function() {
var originalFn = grid.getRefItems;
return function(deep) {
var result = originalFn.call(grid, deep);
if (deep) {
for (var i in me.components) {
result.push(me.components[i]);
result.push.apply(result, me.components[i].getRefItems(true));
}
}
return result;
}
}());
},
destroyComponents: function() {
var me = this,
components = me.components;
for (var i in components) {
components[i].destroy();
}
me.components = {};
},
onExpandBody: function(rowNode, record, expandRow, eOpts) {
var me = this,
grid = me.grid,
recordId = record.id,
componentWrapId = grid.id + '-component-wrap-' + recordId,
component = me.components[recordId];
if (component && !component.rendered) {
component.render(componentWrapId);
}
},
renderComponent: function (out, rowValues) {
var me = this,
grid = me.grid,
store = grid.getStore(),
recordId = rowValues.id,
record = store.getById(recordId),
componentWrapId = grid.id + '-component-wrap-' + recordId,
componentId = grid.id + '-component-' + recordId,
component,
config;
if (me.components[recordId]) {
return; // already rendered
}
config = Ext.apply({}, { id: componentId }, me.componentConfigFn(record));
me.components[recordId] = component = Ext.create(config);
out.push('<div id="' + componentWrapId + '"></div>');
}
});
Чтобы выбрать компоненты из rowbody, вы можете использовать grid.query
метод.
Fiddle: http://jsfiddle.net/znnqxmyq/9/
Смежные вопросы
- 1. ExtJS 4.0.7: Вложенные сетки/RowExpander
- 2. ExtJS 4.2: RowExpander - не работает
- 3. Панель рендеринга внутри Extjs Grid Row Expander's rowBodyTpl
- 4. ExtJS 4.1 - Перетаскивание с проблемами RowExpander
- 5. sencha extjs 4.2 rowexpander architect 3
- 6. Поддерживает ли ExtJS 4.1 вложенные сетки?
- 7. Как правильно сочетать rowediting и rowexpander в extjs?
- 8. RowExpander для повторяющихся записей в ExtJS
- 9. extjs - CheckboxModel и RowExpander не могут использоваться вместе?
- 10. Extjs - выбор формы внутри rowexpander
- 11. ExtJS 4.2.0 RowExpander с динамическими данными загрузки
- 12. Экран ExtJS RowExpander только при условии
- 13. Изменение нормальной сетки в сетке с помощью RowExpander
- 14. Как развернуть или свернуть все строки, используя ExtJs rowexpander?
- 15. ExtJs textarea с форматированием
- 16. Как использовать ExtJS stripeRows с плагином RowExpander в IE8
- 17. Круглые углы в TextField ExtJS
- 18. Развернуть все строки сетки по умолчанию с помощью rowexpander - EXTJS 5
- 19. проблема с решеткой решетки с расширением rowexpander extjs 4.21
- 20. Как обновить форму ExtJS сетки
- 21. GXT TextField или TextArea не расшифровывать HTML entites
- 22. extjs 6 Вложенные сетки с виджетной колонкой
- 23. ExtJS - Как проверить, если редактор ячейки TextField существует или нет
- 24. Предупреждение или диалог JavaScript с TextArea вместо TextField
- 25. extjs textfield replace string format
- 26. Extjs - textarea введите событие
- 27. ExtJS 5 TextField ошибка (хром)
- 28. ExtJs textarea multiline issue
- 29. ExtJS 6 Хранилище фильтров сетки по фамилии или имени middlen
- 30. Отображение введенного TextField в другом TextArea
Это не будет работать, если записи сетки будет когда-либо вызывать множество на них. Набор запускает событие изменения в хранилище, которое в свою очередь синхронизирует шаблон строки, который удаляет узел компонента из сетки ... – AMember