Кнопка refresh не работает в pagingtoolbar без ViewModel
Всем привет!
Обнаружил сегодня такую интересную багу(?) при выводе таблицы. Если я не указываю ViewModel и просто прописываю store вот так для грида и pagingtoolbar:
store: {
type: 'employees'
}
То данные в таблицу отлично загружаются, но кнопка refresh в тулбаре не обновляет ничего. Но если создать ViewModel вот такой:
Ext.define('MyApp.view.employees.EmployeesModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.employees',
requires: [
'Ext.data.Store',
'Ext.data.proxy.Memory',
'Ext.data.field.Integer',
'Ext.data.field.String',
'Ext.data.field.Date',
'Ext.data.field.Boolean',
'Ext.data.reader.Json'
],
stores: {
usersResults: {
type: 'employees'
},
}
});
А потом прописать его во вьюхе:
viewModel: {
type: 'employees'
},
И прописать store через bind в гриде и тулбаре:
bind: '{usersResults}'
То кнопка refresh отлично работает! С чем связано подобное поведение? :-? |
так в документации, например, в версии 5.1.3
для грида http://docs.sencha.com/extjs/5.1.3/a...html#cfg-store параметр store может содержать Store config object, например { type: 'employees' } а смотрим на pagingtoolbar http://docs.sencha.com/extjs/5.1.3/a...html#cfg-store параметр store только либо Ext.data.Store class / subclass либо String - ID of a store так что, похоже, ваше поведение pagingtoolbar согласно документации :-) |
Это потому, что конфиг с типом хранилища приводит к созданию отдельного экземпляра, и получается, что у grid одно хранилище, а у Paging toolbar другое. Как два гуся из песенки. :)
|
Цитата:
Так каким образом прописывать store здесь? Через storeID? ViewModel мне тут в принципе не особо нужна... |
например в initComponent
создай укажи store для Paging toolbar, как здесь делают http://examples.sencha.com/extjs/5.1...k/#paging-grid |
Удаляю строку в гриде через actioncolumn вот так:
{
xtype: 'button',
iconCls: 'x-fa fa-close',
handler: function(grid, rowIndex, colIndex) {
//get store
var store = grid.getStore();
//get current record by row index
var rec = store.getAt(rowIndex);
//delete (autosync do all job)
store.remove(rec);
}
}
Но итоговое количество в pagingtoolbar остается прежним. Какое-то событие надо вызывать его обновления? |
store.sync() store.reload() |
Или в свойствах store укажи
autoSync : true |
Цитата:
достаточно просто обновить информацию на pagingtoolbar pagingToolbar.onLoad(); для надежности иногда можно gridStore.totalCount = gridStore.count(); pagingToolbar.onLoad(); |
Цитата:
Цитата:
Простой onLoad() ничего не делает. Интересно, почему такой простой момент автоматом не выполняется? :blink: |
Пока что такое решение:
//get store var store = grid.getStore(); //get current record by row index var rec = store.getAt(rowIndex); //delete (autosync do all job) store.remove(rec); //reload store store.reload(); Соответственно, это еще +1 запрос после удаления на получение списка снова, что не очень радует. |
Цитата:
обновляет toolbar простенький пример https://fiddle.sencha.com/#fiddle/1i3e нажми кнопку Удалить первую строку - обновится только данные в примере из статического json берутся, поэтому сами данные, которые через ajax запрашиваются, не обновляется |
Хм... а у меня в 6.0.1 почему-то всегда выпадает значение в getTotalCount() ДО удаления. Лишь в count() реальное значение, но там только видимые данные, в пагинации.
|
В общем, ребят, так я и не пойму как store объявлять без ViewModel.:help:
Лезем в доку и видим, что можно передавать storeId что в грид, что в тулбар: http://docs.sencha.com/extjs/6.2.0/c...html#cfg-store http://docs.sencha.com/extjs/6.2.0/c...html#cfg-store Ок. Прописываем у store следующее: storeId: 'employees1', Пишем `store: 'employees1'` в тулбаре и гриде и получаем ошибку: TypeError: store is undefined Хорошо, ищем примеры объявления. Например, в примере грида сразу есть такое:
store: Ext.data.StoreManager.lookup('employees1'),
Прописываем в грид и тулбар и в итоге наши записи не грузятся в таблицу:blink: То же самое для этого кода:
store: Ext.getStore('employees1')
Зато если прописать вот так:
//грид
store: Ext.create('MyApp.store.employees.Employees'),
//тулбар
store: Ext.getStore('employees1')
то все работает, НО.... теперь даже если захожу во view логина, то у меня ИДЕТ GET ЗАПРОС на получение сотрудников из главного view, который еще даже не загружен. Я так понимаю, это связано с requires секцией, но в view логина я не гружу этот store. В общем, это какое-то сильное колдунство...со stores во ViewModel все работает адекватно и грузится именно тогда, когда вызвана вьюшка. |
Кстати, про этот фидл:
https://fiddle.sencha.com/#fiddle/1i3e Такой код: store.totalCount = store.getTotalCount() - 1; pb.onLoad(); Разве учитывает то, что мы удалим не один элемент, а, например, 5... или когда несколько пользователей работают с таблицей и удаляют одновременно разные записи? Похоже, релоад store лучший вариант. |
В общем, посмотрел я вот этот пример:
http://examples.sencha.com/extjs/6.2...k/#paging-grid и увидел, что в `pagingtoolbar` вообще можно store не прописывать и все замечательно работает. Убедился, что это так. Хватает такого кода в гриде:
store: {
type: 'employees'
},
Чудеса) В одном примере Сенча прописывает, в другом нет... |
В документации к 6.2 классик версии
http://docs.sencha.com/extjs/6.2.0/c...html#cfg-store сказано If no store is provided, the store of the owner component (if there is an owner and it has a store) is used. |
| Часовой пояс GMT +3, время: 19:00. |