ComboBox с данными из другой таблицы modExtra

27 сентября 2018, 19:09

При написании своего компонента на заготовке modExtra не редко встаёт задача сделать в какой-то таблицы возможность добавления данными через select из другой таблицы. На выходе у нас должно получиться что-то типа этого: assets/components/extras/js/mgr/misc/combo.js — этот файл в нашей заготовке уже имеет пример добавления категории. Благодаря этому примеру я добавил в этом файле новый combobox элемент и его зарегистрировал:

Extras.combo.Repository = function (config) {
    config = config || {};

    Ext.applyIf(config, {
        name: 'repository_id',
        fieldLabel: _('repositories_' + config.name || 'repository'),
        hiddenName: 'repository_id',
        displayField: 'name',
        valueField: 'id',
        anchor: '99%',
        fields: ['name', 'id'],
        pageSize: 20,
        url: Extras.config['connector_url'],
        typeAhead: true,
        editable: true,
        allowBlank: true,
        emptyText: _('no'),
        minChars: 1,
        baseParams: {
            action: 'mgr/repository/getlist',
            combo: true,
            id: config.value,
        }
    });
    Extras.combo.Repository.superclass.constructor.call(this, config);
    this.on('expand', function () {
        if (!!this.pageTb) {
            this.pageTb.show();
        }
    });
};
Ext.extend(Extras.combo.Repository, MODx.combo.ComboBox);

а xtype в assets/components/extras/js/mgr/widgets/categories.window.js вышел такой:

                {
            xtype: 'extras-combo-repository',
            fieldLabel: _('extras_category_repository'),
            anchor: '99%',
            allowBlank: true,
        },

Чтобы понимали, выкладываю код файла assets/components/extras/js/mgr/widgets/categories.window.js:

Extras.window.CreateCategory = function (config) {
    config = config || {};
    if (!config.id) {
        config.id = 'extras-category-window-create';
    }
    Ext.applyIf(config, {
        title: _('extras_category_create'),
        width: 550,
        autoHeight: true,
        url: Extras.config.connector_url,
        action: 'mgr/category/create',
        fields: this.getFields(config),
        keys: [{
            key: Ext.EventObject.ENTER, shift: true, fn: function () {
                this.submit()
            }, scope: this
        }]
    });
    Extras.window.CreateCategory.superclass.constructor.call(this, config);
};
Ext.extend(Extras.window.CreateCategory, MODx.Window, {

    getFields: function (config) {
        return [{
            xtype: 'textfield',
            fieldLabel: _('extras_category_name'),
            name: 'name',
            id: config.id + '-name',
            anchor: '99%',
            allowBlank: false,
        }, {
            xtype: 'extras-combo-repository',
            fieldLabel: _('extras_category_repository'),
            anchor: '99%',
            allowBlank: true,
        }, {
            xtype: 'xcheckbox',
            boxLabel: _('extras_category_active'),
            name: 'active',
            id: config.id + '-active',
            checked: true,
        }];
    },

    loadDropZones: function () {
    }

});
Ext.reg('extras-category-window-create', Extras.window.CreateCategory);

Extras.window.UpdateCategory = function (config) {
    config = config || {};
    if (!config.id) {
        config.id = 'extras-category-window-update';
    }
    Ext.applyIf(config, {
        title: _('extras_category_update'),
        width: 550,
        autoHeight: true,
        url: Extras.config.connector_url,
        action: 'mgr/category/update',
        fields: this.getFields(config),
        keys: [{
            key: Ext.EventObject.ENTER, shift: true, fn: function () {
                this.submit()
            }, scope: this
        }]
    });
    Extras.window.UpdateCategory.superclass.constructor.call(this, config);
};
Ext.extend(Extras.window.UpdateCategory, MODx.Window, {

    getFields: function (config) {
        return [{
            xtype: 'hidden',
            name: 'id',
            id: config.id + '-id',
        }, {
            xtype: 'textfield',
            fieldLabel: _('extras_category_name'),
            name: 'name',
            id: config.id + '-name',
            anchor: '99%',
            allowBlank: false,
        }, {
            xtype: 'extras-combo-repository',
            fieldLabel: _('extras_category_repository'),
            anchor: '99%',
            allowBlank: true,
        }, {
            xtype: 'xcheckbox',
            boxLabel: _('extras_category_active'),
            name: 'active',
            id: config.id + '-active',
        }];
    },

    loadDropZones: function () {
    }

});
Ext.reg('extras-category-window-update', Extras.window.UpdateCategory);

Чтобы в таблице Grid выводились не ID репозиториев, а их названия, то нужно в файле /core/components/extras/processors/mgr/category/getlist.class.php добавить в функцию leftJoin и select через API xPDO:

    public function prepareQueryBeforeCount(xPDOQuery $c)
    {
        $query = trim($this->getProperty('query'));

        $c->leftJoin('ExtrasRepositories', 'ExtrasRepositories', 'ExtrasRepositories.id = ExtrasCategories.repository_id');
        $c->select(array($this->modx->getSelectColumns('ExtrasCategories', 'ExtrasCategories')));
        $c->select(array('ExtrasRepositories.name as repository_name'));

        if ($query) {

            $c->where([
                'name:LIKE' => "%{$query}%",
                'OR:repository_id:LIKE' => "%{$query}%"
            ]);
        }

        return $c;
    }

следующий код

        $c->leftJoin('ExtrasRepositories', 'ExtrasRepositories', 'ExtrasRepositories.id = ExtrasCategories.repository_id');
        $c->select(array($this->modx->getSelectColumns('ExtrasCategories', 'ExtrasCategories')));
        $c->select(array('ExtrasRepositories.name as repository_name'));

MODX.ONE
1    4580    1
+4

Комментарии ()

  1. MODX.ONE 02 октября 2018, 09:04 # +2
    Осталось разобраться как вывести в таблицу grid вместо id названия.

    Вы должны авторизоваться, чтобы оставлять комментарии.