Наверх

Добавляем массовые операции в грид ExtJS

В modExtra по умолчанию создается кастомный объект в базе данных и CMP в админке для управления этими объектами. Но там нет возможности выделить несколько строк. Исправим это небольшое упущение и сделаем массовое выделение и, например, удаление объектов в табличке ExtJS. Делаем массовое выделение:
modExtra.grid.Items = function(config) {
    config = config || {};
    this.sm = new Ext.grid.CheckboxSelectionModel(); // Добавляем эту строчку
	Ext.applyIf(config,{
		id: 'impart-grid-items'
		,url: impArt.config.connector_url
		,baseParams: {
			action: 'mgr/item/getlist'
		}
		,fields: ['id', 'name', 'description']
		,autoHeight: true
		,paging: true
		,remoteSort: true
		,sm: this.sm			     // и эту
...
Добавляем методы:
...
    ,getSelectedAsList: function() {
        var sels = this.getSelectionModel().getSelections();
        if (sels.length <= 0) return false;

        var cs = '';
        for (var i=0;i

Кнопку "Удалить выбранные":
...
		,tbar: [{
    		text: _('modextra_item_create')
			,handler: this.createItem
			,scope: this
		},{
    		text: _('modextra_items_remove')
			,handler: this.removeSelected
			,scope: this
		]}
		,listeners: {
			rowDblClick: function(grid, rowIndex, e) {
				var row = grid.store.getAt(rowIndex);
				this.updateItem(grid, e, row);
			}
		}
...
И процессор multiremove.class.php:
 dirname(__FILE__) . '/');
        foreach (explode(',',$this->getProperty('resources')) as $id) {
            $response = $this->modx->runProcessor('remove', array('id' => $id), $processorProps);
            if ($response->isError()) {
                return $response->response;
            }
        }
        return $this->success();

	}

}

return 'modExtraItemMultyRemoveProcessor';
Чтобы можно было удалять и по правому клику на выделенных объектах, исправляем метод getMenu:
...
	,getMenu: function() {
        var cs = this.getSelectedAsList();
        var m = [];
        if (cs.split(',').length > 1) {
        	m.push({
    			text: _('modextra_items_remove')
    			,handler: this.removeSelected
    		});
        } else {
    		m.push({
    			text: _('modextra_item_update')
    			,handler: this.updateItem
    		});
    		m.push('-');
    		m.push({
    			text: _('modextra_item_remove')
    			,handler: this.removeItem
    		});
        }
		this.addContextMenuItem(m);
    }
...
Я форкнул modExtra Василия Наумкина и добавил туда мультиселект. Вот изменения, а вот сам форк.


4 комментария

  1. Михаил Лавронов 01 апреля 2014, 12:11(Комментарий был изменён) # 0
    Балин, я еще не изучил толком этот компонент с обучением, а тут уже понеслось добавки)
    Хотел бы еще добавить кнопочку Выбрать всех. Например если там 10000 подписчиков. Но пока изучаю уроки.
    1. vanchelo 05 апреля 2014, 16:49 # 0
      Кнопочку добавить не сложно
    2. Павел 26 февраля 2017, 14:15 # 0
      Чужой код добавлять дело не особо хитрое. Хочется объяснений 'откуда ноги растут', чтоб понять сам принцип каким образом данные для админки в нее попадают и каким образом обрабатываются.
      1. Илья Уткин 27 февраля 2017, 15:36 # 0
        Про это уже есть материал:
        Курс создания своего компонента — там есть помимо практики ещё и теория — какие файлы для чего нужны и откуда вызываются. И пара статей: ExtJs для новичков — Часть 1 и Часть 2

      Авторизация

      через сервис Loginza:


      Шаблоны MODX

      1 2 Дальше »

      Объектная
      модель
      MODX