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

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

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

  1. Extras.combo.Repository = function (config) {
  2. config = config || {};
  3. Ext.applyIf(config, {
  4. name: 'repository_id',
  5. fieldLabel: _('repositories_' + config.name || 'repository'),
  6. hiddenName: 'repository_id',
  7. displayField: 'name',
  8. valueField: 'id',
  9. anchor: '99%',
  10. fields: ['name', 'id'],
  11. pageSize: 20,
  12. url: Extras.config['connector_url'],
  13. typeAhead: true,
  14. editable: true,
  15. allowBlank: true,
  16. emptyText: _('no'),
  17. minChars: 1,
  18. baseParams: {
  19. action: 'mgr/repository/getlist',
  20. combo: true,
  21. id: config.value,
  22. }
  23. });
  24. Extras.combo.Repository.superclass.constructor.call(this, config);
  25. this.on('expand', function () {
  26. if (!!this.pageTb) {
  27. this.pageTb.show();
  28. }
  29. });
  30. };
  31. Ext.extend(Extras.combo.Repository, MODx.combo.ComboBox);

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

  1. {
  2. xtype: 'extras-combo-repository',
  3. fieldLabel: _('extras_category_repository'),
  4. anchor: '99%',
  5. allowBlank: true,
  6. },

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

  1. Extras.window.CreateCategory = function (config) {
  2. config = config || {};
  3. if (!config.id) {
  4. config.id = 'extras-category-window-create';
  5. }
  6. Ext.applyIf(config, {
  7. title: _('extras_category_create'),
  8. width: 550,
  9. autoHeight: true,
  10. url: Extras.config.connector_url,
  11. action: 'mgr/category/create',
  12. fields: this.getFields(config),
  13. keys: [{
  14. key: Ext.EventObject.ENTER, shift: true, fn: function () {
  15. this.submit()
  16. }, scope: this
  17. }]
  18. });
  19. Extras.window.CreateCategory.superclass.constructor.call(this, config);
  20. };
  21. Ext.extend(Extras.window.CreateCategory, MODx.Window, {
  22. getFields: function (config) {
  23. return [{
  24. xtype: 'textfield',
  25. fieldLabel: _('extras_category_name'),
  26. name: 'name',
  27. id: config.id + '-name',
  28. anchor: '99%',
  29. allowBlank: false,
  30. }, {
  31. xtype: 'extras-combo-repository',
  32. fieldLabel: _('extras_category_repository'),
  33. anchor: '99%',
  34. allowBlank: true,
  35. }, {
  36. xtype: 'xcheckbox',
  37. boxLabel: _('extras_category_active'),
  38. name: 'active',
  39. id: config.id + '-active',
  40. checked: true,
  41. }];
  42. },
  43. loadDropZones: function () {
  44. }
  45. });
  46. Ext.reg('extras-category-window-create', Extras.window.CreateCategory);
  47. Extras.window.UpdateCategory = function (config) {
  48. config = config || {};
  49. if (!config.id) {
  50. config.id = 'extras-category-window-update';
  51. }
  52. Ext.applyIf(config, {
  53. title: _('extras_category_update'),
  54. width: 550,
  55. autoHeight: true,
  56. url: Extras.config.connector_url,
  57. action: 'mgr/category/update',
  58. fields: this.getFields(config),
  59. keys: [{
  60. key: Ext.EventObject.ENTER, shift: true, fn: function () {
  61. this.submit()
  62. }, scope: this
  63. }]
  64. });
  65. Extras.window.UpdateCategory.superclass.constructor.call(this, config);
  66. };
  67. Ext.extend(Extras.window.UpdateCategory, MODx.Window, {
  68. getFields: function (config) {
  69. return [{
  70. xtype: 'hidden',
  71. name: 'id',
  72. id: config.id + '-id',
  73. }, {
  74. xtype: 'textfield',
  75. fieldLabel: _('extras_category_name'),
  76. name: 'name',
  77. id: config.id + '-name',
  78. anchor: '99%',
  79. allowBlank: false,
  80. }, {
  81. xtype: 'extras-combo-repository',
  82. fieldLabel: _('extras_category_repository'),
  83. anchor: '99%',
  84. allowBlank: true,
  85. }, {
  86. xtype: 'xcheckbox',
  87. boxLabel: _('extras_category_active'),
  88. name: 'active',
  89. id: config.id + '-active',
  90. }];
  91. },
  92. loadDropZones: function () {
  93. }
  94. });
  95. Ext.reg('extras-category-window-update', Extras.window.UpdateCategory);

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

  1. public function prepareQueryBeforeCount(xPDOQuery $c)
  2. {
  3. $query = trim($this->getProperty('query'));
  4. $c->leftJoin('ExtrasRepositories', 'ExtrasRepositories', 'ExtrasRepositories.id = ExtrasCategories.repository_id');
  5. $c->select(array($this->modx->getSelectColumns('ExtrasCategories', 'ExtrasCategories')));
  6. $c->select(array('ExtrasRepositories.name as repository_name'));
  7. if ($query) {
  8. $c->where([
  9. 'name:LIKE' => "%{$query}%",
  10. 'OR:repository_id:LIKE' => "%{$query}%"
  11. ]);
  12. }
  13. return $c;
  14. }

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

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

MODX.ONE
1    5170    1
+4

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

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

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