MODX. MIGX, расширение функциональности дополнительных полей (TV)
Отредактировано: 20 Марта 2023
Частые JSON конструкции
//вкладки формы
[{"caption":"Элементы", "fields": [
{"field":"title","caption":"Заголовок"},
{"field":"description","caption":"Описание", "inputTVtype":"richtext"},
{"field":"image","caption":"Изображение","inputTV":"image","sourceFrom":"migx"}
]}]
//Разметка колонок
[
{"header": "Заголовок", "width": "50", "sortable": "true", "dataIndex": "title"},
{"header": "Изображение", "width": "50", "sortable": "false", "dataIndex": "image","renderer": "this.renderImage"},
{"header": "Описание", "width": "150", "sortable": "false", "dataIndex": "description"}
]
MIGX позволяет разработчику создавать формы / таблицы / миниприложения с неограниченным набором полей и гибко настраивать их структуру в рамках одного TV поля. Поля MIGX создаются аналогично обычным, за исключением пары дополнительных настроек.
Коротко о главном в MIGX от OpenMODX:
Текстовая версия:
Для создания MIGX поля надо установить компонент MIGX (во время установки компонент спросит, где располагать пункт меню MIGX, в меню MODX или в подпункте Extras, имхо, если не планируете создавать ТВ каждый день, устанавливайте в подпункт). Далее, для создания доп. поля действуем по следующей схеме:
- Создать новое дополнительное поле;
- На вкладке «Общая информация» заполнить поля: Имя и Подпись;
- На вкладке «Доступно для шаблонов» отметить необходимые шаблоны. (При необходимости настроить права доступа и источники файлов);
- На вкладке «Параметры ввода» установить «тип ввода» MIGX, и создать структуру полей. Сделать это можно двумя способами, либо написав нужный JSON код самостоятельно, либо заполнив соответствующие поля на специальной странице.
В поле «Тип ввода» выбрать MIGX, и заполнить поля «Вкладки формы» и «Разметка колонок». Параметры для этих полей описаны ниже.
BackEnd
Код для поля «Вкладки формы» (Form Tabs)
Создание и настройка доп полей MIGX
[{"caption":"Первая вкладка", "fields":
[
{"field":"title","caption":"Заголовок"},
{"field":"description","caption":"Описание", "description":"Описание для поля описания", "inputTVtype":"richtext"}
]
}, {"caption":"Вторая вкладка", "fields":
[
{"field":"image","caption":"Изображение","inputTVtype":"image","sourceFrom":"MIGX"}
]
}]
- formtabs — вкладка всплывающего окна, разделяющая группы полей. Если указана только одна, то вкладки не отображаются;
- caption — заголовок вкладки или поля, который будет отображаться в админпанели;
- fields — поля содержащиеся на вкладке;
- field — символьный код поля;
- description — Описание поля ввода в панели управления;
- inputTV — тип поля для ввода данных. Применяется если НЕ надо указывать специфические настройки, такие как значения по умолчанию, параметры вывода и пр. (необязательный атрибут);
- inputTVtype — тип поля для ввода данных. Применяется если НАДО указывать специфические настройки, такие как значения по умолчанию, параметры вывода и пр. (необязательный атрибут);
- sourceFrom — указывается предустановленный в настройках TV-поля источник файлов (необязательный атрибут). Чтобы это поле работало, необходимо создать и указать соответствующий inputTV;
- inputOptionValues — параметр для указания возможных значений таких типов полей как listbox (необязательный атрибут);
параметры для формирования столбцов:
- header — отображаемое имя столбца;
- dataIndex — указывается значение параметра "field", для которого формируется столбец. Не обязательно указывать существующее поле, например если в последствии будет использоваться рендер чанка или что-то в этом роде.;
- editor — указывается для того, чтобы можно было редактировать значения прямо в теле таблицы, не заходя в модальное окно редактирования;
Код для поля «Разметка колонок» (Grid Columns)
Вывод полей на странице создания ресурса
[
{"header": "Заголовок", "width": "160", "sortable": "true", "dataIndex": "title"},
{"header": "Изображение", "width": "50", "sortable": "false", "dataIndex": "image","renderer": "this.renderImage"}
]
- header — заголовок поля, который будет отображаться в админпанели;
- width — ширина колонки отображения в админ панели;
- sortable — указывается возможность сортировки в админ панели по данному полю, значения true или false;
- dataIndex — значение привязывающее к значению field из символьного кода поля;
- renderer — поле для отображения типа данных в админпанели. Можно использовать средства визуализации для каждого столбца. Например, для того чтобы отобразить миниатюры изображений.
- editor — для возможности редактирования ячейки в админпанели в таблице предпросмотра.
Полный список представлен ниже, в «описании вкладок и параметров».
На вкладке TV «Тип ввода» в поле «Конфигурация» (Configurations) прописать название конфигурации полей, которая будет создана далее. Затем перейти в меню компонента MIGX (расположение этого меню выбирается при установке, размещается либо в основном списке, либо в меню «Приложения» (Extras)).
В MIGX Management поля добавляются через вкладку MIGX, там нажимаем "Добавить элемент", этот элемент и будет новой конфигурацией. В появившемся окне создания конфигурации очень много настроек, от параметров которых и зависит каким будет новое MIGX поле. Настройки можно устанавливать вручную, или импортировать из json файла (этот пункт возможен если кликнуть правой кнопкой мыши по названию конфигурации в списке конфигураций). Поля для настройки конфигурации описаны ниже.
Описание вкладок и параметров MIGX
Рядом с названием поля курсивом в квадратных скобках указано название для кода JSON.
Settings
Базовые настройки для формы поля MIGX
- Name — название, которое указывается в поле «конфигурация» при создании дополнительного поля.
- Category — категория. Помогает в фильтрации конфигураций, если их, к примеру, очень много.
- Add new Category — добавляет новую категорию.
- "Add Item" Replacement — замена текста на кнопке Add Item.
- Disable Add Items — убрать возможность добавления новых элементов, но оставить возможность редактирования существующих.
- Add Items directly — добавлять элементы сразу, не вызывая всплывающее окно.
- Form Caption — заголовок внутри всплывающего окна для заполнения полей. Можно указывать теги MODX.
- Window Title — название поля в окне создания ресурса.
- unique MIGX ID — уникальный ID поля MIGX.
- max MIGX records — максимальное количество записей которое можно добавить к ресурсу.
- Add new MIGX records at — позиция для новых добавленных элементов: bottom или top.
- Mediasource ID — ID медиаисточника.
Formtabs [formtabs]
Вкладка, формирующая во всплывающем окне табы с полями MIGX. Если указана только одна, то вкладки не отображаются.
- Fields — [fields] — тут добавляются поля конфигурации MIGX, которые будут доступны на странице добавления ресурса. Каждый итем содержит в себе коллекцию полей одной вкладки MIGX.
- Caption — [caption] — заголовок для группы полей.
- Display above Tabs — показывать над другими табами (работает только если это первый таб).
- Fields — добавление полей.
Вкладка Field [field]
Формирует данные поля
- Fieldname — текстовое ID поля.
- Caption — название поля.
- Description — [description] — описание для поля.
- Description is Code — описание кода.
- Input TV — [inputTV] — тип поля для ввода данных. Применяется если НЕ надо указывать специфические настройки, такие как значения по умолчанию, параметры вывода и пр. (необязательный атрибут).
- Input TV type — [inputTVtype] — тип поля для ввода данных. Применяется если НАДО указывать специфические настройки, такие как значения по умолчанию, параметры вывода и пр. (необязательный атрибут).
- Validation — условия для валидации по полю.
- Configs — поле для дополнительной конфигурации. Можно использовать для migx-TV-configname, либо для свойств ввода любого TV-type как json-string.
- Restrictive Condition (MODX tags) — ограничительное условие. Пустой результат будет отображать значение этого поля.
- Display — выбор, отображать поле или нет.
Вкладка Mediasources
При необходимости, привязывает к полю источники файлов.
- source From — [sourceFrom] — выбор места из которого брать значение для источника файлов.
- Sources — поле для указания источника файлов который должен использоваться (в качестве базового контекста используйте web).
Вкладка Input Options
Дополнительные параметры для поля.
- Input Option Values — [inputOptionValues] — список возможных значений для полей типа выпадающих списков и чекбоксов.
- Default Value — значение настроек по умолчанию (например: @CHUNK getAttributeOptions).
- Use Default if Empty — использовать ли значение по умолчанию если параметр Input Option Values не указан.
- Multiple Formtabs — поле для выбора конфигураций форм которые будут доступны во всплывающем окне MIGX поля.
- Multiple Formtabs Label — лейбл для поля выбора формы.
- Multiple Formtabs Field — имена полей для этой конфигурации формы. По умолчанию: MIGX_formname.
- Multiple Formtabs Optionstext — текст который будет выводиться в селекте, для обозначения данной конфигурации формы.
- Multiple Formtabs Optionsvalue — значение для данной конфигурации формы.
Columns
Вкладка отвечающая за то, как пользователи админ панели будут видеть содержимое MIGX поля в админке. Аналогично полю «Разметка колонок» из метода с использованием кода. Для последующей корректной работы возможности редактирования, должно быть предусмотренно поле id.
Кнопка AddItem позволяет добавить поле для отображения в админке. Поля для заполнения:
Вкладка Column [dataIndex]
- Header — [header] — заголовок для поля.
- Field — уникальный ID поля, которое должно отображаться.
- Column width — ширина которую должна занимать колонка
- Sortable — должна ли быть возможность сортировки по полю.
- Show in Grid — показывать ли в сетке. Если указано нет - столбец будет по умолчанию скрыт.
Вкладка Renderer
- Custom Renderer — если необходим собственный рендер, которого нет в списке.
- Renderer — список предустановленных рендеров.
- on Click — действие по клику.
- SelectFromGrid config — .
- renderChunk template — чанк с шаблоном рендера.
- Renderoptions — прочие настройки для рендера, например имя чанка который должен быть обработан.
Вкладка Cell Editor [editor]
Выбор отображения редактора ячейки в таблице предпросмотра.
- this.textEditor — текстовый редактор;
- this.listboxEditor — выпадающий список.
Contextmenues / Columnbuttons
Contextmenues — кнопки для контекстного меню, которое открывается при клике правой кнопкой мыши на списке элементов.
Columnbuttons — кнопки для редактирования в
Для корректной работы, в колонках нужно создать поле id, иначе будет проблема с редактированием данных.
- update — редактировать.
- duplicate — дублировать.
- addbefore — добавить до.
- addafter — добавить после.
- publish — публиковать.
- unpublish — снять с публикации.
- activate — активировать.
- deactivate — деактивировать.
- recall_remove_delete —
- remove — удалить.
- edit_migx — редактировать для migx.
- duplicate_migx — дублировать для migx.
- remove_migx — удалить для migx.
- remove_migx_and_image — удалить migx элемент и изображения.
- movetotop_migx — сдвинуть выше для migx.
- movetotop_bottom — сдвинуть вверх или вниз.
- publishtarget — публиковать выбранные.
- unpublishtarget — снять с публикации выбранные.
Actionbuttons
Добавляет дополнительные кнопки в окне создания/редактирования элемента поля.
- Buttons per row — количество кнопок на строку
- Actionbuttons — варианты кнопок
- addItem — добавить элемент.
- bulk — массовые действия: publish, unpublish, delete.
- toggletrash — переключатель: просмотр элементов в карзине / нормальный просмотр.
- exportview — экспортировать.
- exportimportmigx — экспорт/импорт параметров поля migx в формате json.
- upload — загрузка.
- loadfromsource — загрузка элементов из пивязанного медиаресурса.
- resetwinposition — сброс позиционирования окна.
- emptyTrash — очистить корзину.
- uploadfiles — загрузить файлы (мультизагрузка).
- uploadfiles_db — загрузить файлы в базу данных (мультизагрузка).
- importcsvmigx — импортировать из csv.
- import_from_package — импортировать из пакета.
Window Buttons
Кнопки в окне
- cancel — отмена;
- done — готово.
Extra Handlers
Дополнительные обработчики
- this.resetWinPosition — сбросить позиционирование окна
- this.emptyTrash — очистить корзину
- this.handlePositionSelector — управление позиционированием выбранного
- this.selectSelectorOption —
- gridfilter —
- this.addItem — добавить итем
- this.addNewItem — добавить новый итем
- this.preview — предпросмотр
- this.uploadImages — загрузить изображение
- this.remove — удалить
- this.update — изменить
- this.duplicate — дублировать
- this.addbefore — добавить перед
- this.addafter — добавить после
- this.toggleDeleted —
- this.handleColumnSwitch — переключатель между полями
- this.publishObject — опубликовать объект
- this.unpublishObject — снять объект с публикации
- this.activateObject — активировать объект
- this.deactivateObject — деактивировать объект
- this.publishSelected — опубликовать выбранное
- this.unpublishSelected — снять с публикации выбранное
- this.deleteSelected — удалить выбранное
- this.deleteObject — удалить объект
- this.recallObject — перевызвать объект
- this.csvExport — экспорт CSV
- this.removeObject — удалить объект
- this.publishTargetObject — опубликовать выбранный объект
- this.unpublishTargetObject — снять с публикации выбранный объект
- this.showScreenshot — показать скриншот
- this.uploadFiles — загрузить файлы
- this.uploadSuccess —
- this.loadFromSource_db — загрузить из источника БД
- this.migx_removeMigxAndImage —
- this.exportMigxItems — экспортировать объекты из MIGX
- this.selectImportFile — выбрать импортированный файл
- this.importCsvMigx — импортировать из CSV
- this.import_from_package — импортировать из пакета
Db-Filters
Фильтры для работы с данными из БД
- Filters per row — количество фильтров на страницу.
- Filters — список в который добавляются фильтры.
- filter Name — имя фильтра (на латинице)
- Label — лейбл, название фильтра на любом языке
- Empty Text — текст в незаполненном поле фильтра. Например: --Фильтр по категориям--
- Filter Type — тип фильтра: дата, сброс всего, текстовое поле, мульти список, комбобокс (комбинированный список), древовидный список
- getlist-where — оператор where, для обработки результирующего списка. Пример записи:
{"title:LIKE":"%[[+search]]%","OR:description:LIKE":"%[[+search]]%"}
- getcombo processor — процессор который должен обрабатывать комбобокс (список существующих процессоров). Можно создавать собственные процессоры по адресу: core/components/yourpackage/processors/mgr/default/getpublishedcombo.php
- getcombo textfield — название текстового поля со списком значений для комбобокса
- getcombo idfield — название поля указывающего на id
- getcombo where — оператор where, для обработки результатов комбобокса
- getcombo classname — имя класса для комбобокса
- getcombo packageName — имя пространства имен (название дополнения) для комбобокса
- Prefix — выбор префикса: по умолчанию или собственный
- Custom Prefix — если собственный, то указывается какой
- getcombo joins — оператор JOIN для связи с данными из другой таблицы
- parent combobox — родительский элемент для комбобокса
- default value — значение по умолчанию
MIGXdb-Settings
Настройки для связи поля с собственной таблицей в БД
- Package — пространство имен компонента.
- Classname — имя класса объекта связи с БД.
- Processors Path — путь к процессору.
- getlist defaultsort — сортировка по умолчанию для вывода списка.
- getlist defaultsortdir — направление сортировки по умолчанию для вывода списка.
- Sort Config — параметры сортировки множественных полей, в формате JSON.
- Items per Page Default — количество элементов на странице.
- Prefix — выбор между префиксом по умолчанию и собственным.
- Custom Prefix — указание префикса.
- Grid — сетка ExtJS.
- Load Grid — указание как грузить сетку.
- Check Resource — проверять ли ресурс.
- Check Resource TV — проверять ли доп поля ресурса.
- Join Alias — SQL команда Join Alias.
- Has Extra Connection Table — указывает должно ли поле связываться с таблицей.
- Where — SQL оператор выборки WHERE.
- Joins — указание связи полей из разных таблиц друг с другом, подобно SQL оператору JOIN. Пример записи: [{"alias":"aggregateName","selectfield":"fieldName"}], где alias — это указание на таблицу с которой надо связаться, а field — название поля которое надо получить.
- Hook Snippets — дополнительный блок кода, который надо выполнить при каком-либо событии.
CMP-Settings
Настройки страницы в панели менеджера (CMP)
- Main Caption — основной заголовок;
- Tab Caption — заголовок таба;
- Tab Description — описание таба;
- Custom Tab Controller — пользовательский контроллер для таба (о контроллерах).
MIGXfe-Settings
- Window Buttons — js-код, работающий при создании окна (Подробности в migxfe/templates/web/form/form.tpl and winbuttons.tpl).
- On Submit success — js-код, запускаемый при успешной отправке.
- Submit params — параметры передаваемые пи отправке.
Типы полей для inputTV и inputTVtype:
- autotag — авто-метка;
- text — текст;
- textarea — текстовая область;
- textareamini — текстовая область (мини);
- richtext — текстовый редактор;
- dropdown — выпадающий список;
- listbox — список (одиночный выбор);
- listbox-multiple — список (множественный выбор);
- list-multiple-legacy — устаревший список множественного выбора;
- option — переключатели (radio);
- checkbox — флажки (checkbox);
- image — изображение;
- file — файл;
- url — URL;
- email — электронная почта;
- number — число;
- date — дата;
- tag — тег;
Примеры оформления JSON кода для настройки полей
// autotag поле
"field": "field_autotag",
"caption": "Поле с autotag",
"inputTVtype": "autotag",
// text поле
"field": "field_text",
"caption": "Поле с text",
"inputTVtype": "text",
// textarea поле
"field": "field_textarea",
"caption": "Поле с textarea",
"inputTVtype": "textarea",
// textareamini поле
"field": "field_textareamini",
"caption": "Поле с textareamini",
"inputTVtype": "textareamini",
// richtext поле
"field": "field_richtext",
"caption": "Поле с richtext",
"inputTVtype": "richtext",
// dropdown поле
"field": "field_dropdown",
"caption": "Поле с dropdown",
"inputTVtype": "dropdown",
"inputOptionValues": "Да==1||Нет==0"
// listbox поле
"field": "field_listbox",
"caption": "Поле с listbox",
"inputTVtype": "listbox",
"inputOptionValues": "Да==1||Нет==0"
// listbox-multiple поле
"field": "field_listbox-multiple",
"caption": "Поле с listbox-multiple",
"inputTVtype": "listbox-multiple",
"inputOptionValues": "Да==1||Нет==0"
// list-multiple-legacy поле
"field": "field_list-multiple-legacy",
"caption": "Поле с list-multiple-legacy",
"inputTVtype": "list-multiple-legacy",
"inputOptionValues": "Да==1||Нет==0"
// option поле
"field": "field_option",
"caption": "Поле с option",
"inputTVtype": "option",
"inputOptionValues": "Да==1||Нет==0"
// checkbox поле
"field": "field_checkbox",
"caption": "Поле с checkbox",
"inputTVtype": "checkbox",
"inputOptionValues": "Да==1||Нет==0"
// image поле
"field": "field_image",
"caption": "Поле с image",
"inputTVtype": "image",
"sourceFrom":"migx" // источник media файлов установленный в настройках tv поля
// Чтобы установить источник файлов в настройках поля, его предварительно надо создать
// Возможен вариант с подтягиванием источника из конфигурации сайта
// "sourceFrom":"config",
// "sources":"[{\"MIGX_id\":\"1\",\"context\":\"web\",\"sourceid\":\"3\"},
// {\"MIGX_id\":\"2\",\"context\":\"eng\",\"sourceid\":\"3\"}]"
// file поле
"field": "field_file",
"caption": "Поле с file",
"inputTVtype": "file",
// url поле
"field": "field_url",
"caption": "Поле с url",
"inputTVtype": "url",
// email поле
"field": "field_email",
"caption": "Поле с email",
"inputTVtype": "email",
// checkbox поле
"field": "field_checkbox",
"caption": "Поле с checkbox",
"inputTVtype": "checkbox",
"inputOptionValues": "Да==1||Нет==0"
// number поле
"field": "field_number",
"caption": "Поле с number",
"inputTVtype": "number",
// date поле
"field": "field_date",
"caption": "Поле с date",
"inputTVtype": "date",
// tag поле
"field": "field_tag",
"caption": "Поле с tag",
"inputTVtype": "tag",
Для настройки отображения полей в админке некоторые типы полей требуют предварительного рендера
{
"dataIndex": "image",
"header": "Изображение",
"sortable": "false",
"renderer": "this.renderImage",
"width": "100"
}
Параметры с опциями запоняются аналогично стандартным TV
О рендерах
Предустановленные рендеры:
- this.renderImage — воспроизводит изображение;
- this.renderImageFromHtml — воспроизводит изображение из html кода;
- this.renderPlaceholder — воспроизводит данные из плейсхолдера;
- this.renderFirst — отображает первый элемент;
- this.renderLimited — выводит не более 100 элементов;
- this.renderCrossTick — значки галочка\крестик для boolean полей;
- this.renderClickCrossTick — значки галочка\крестик для boolean полей с возможностью изменения значения кликом (поддерживается для MIGXdb);
- this.renderSwitchStatusOptions — изменение статуса кликом по полю (настраивается через Renderoptions);
- this.renderPositionSelector — отображает позиционный переключатель активно / неактивно;
- this.renderRowActions — воспроизводит функцию установленную в сетке;
- this.renderChunk — отображает указанный чанк;
- ImagePlus.MIGX_Renderer — рендер расширения Image+ (входит в состав MODX);
- this.renderDate — используется для вывода даты;
- this.renderOptionSelector — отображает опции checkbox списка;
Предустановленные рендеры для поля editor:
- this.textEditor — простое текстовое поле
- this.listboxEditor — показывает список с вводимыми параметрами из указанного поля
Коды рендеров храняться по адресу: core/components/migx/config/grid/ в файлах grid.renderer.config.php и grid.renderer.inc.php. Чтобы добавить свой рендер надо отредактировать оба указанных файла, просто берем существующий рендер, копируем, а дальше видоизменяем исходя из задачи.
Вывод информации MIGX на сайте
Для вывода данных из MIGX поля на сайт, можно использовать fenom, написать свой снипет конвертации json в данные, либо использовать один из идущих в комплекте с MIGX сниппетов: getImageList или migxLoopCollection. Подробнее о возможностях getImageList. Подробнее о возможностях migxLoopCollection.
Вывод поля MIGX при помощи Fenom выглядит так:
{set $rows = json_decode($_modx->resource.tvMIGX, true)}
{foreach $rows as $row}
<p>{$row.id}-{$row.text}</p>
{/foreach}
Вывод поля MIGX при помощи сниппета getImageList:
[[getImageList?
&tvname=`myMIGXtv`
&tpl=`@CODE:<li>[[+idx]]<img alt="" src="[[+image]]" /><p>[[+title]]</p></li>`
]]
Для вывода полей в скобках указывается их символьный код. У каждого элемента есть предопределенное поле ID, которое можно получить используя код [[+idx]].
При выводе через xPDO поле предварительно надо декодировать из формата json. Вывод через xPDO будет примерно таким:
$migx = $modx->resource->getTVValue('tvname');
$items = $modx->fromJSON($migx);
$output = array();
foreach($items as $item) {
$output[] = $item['field1'].' — '.$item['field2'];
}
При записи в поле MIGX кодируем обратно:
$modx->resource->setTVValue('tvname', $modx->toJSON($output));
MIGX и базы данных / создание приложения c MIGX
MIGX можно привязывать к собственным таблицам. Порядок действий для настройки работы MIGX с базой данных:
- На странице администрирования MIGX, в разделе Package Manager в поле Package Name надо указать название компонента, и нажать кнопку Create Package, после чего в структуре админки будет создан соответствующий каталог. О структуре компонентов MODX.
- Далее, на вкладке XML Schema указываем схему БД и сохраняем кнопкой Save Scheme (схема используется для того чтобы была возможность работать с БД разного типа, подробнее в статье про структуру компонентов).
- На вкладке Schema нажимаем "parse schema", после этого действия создасться структура файлов компонента, позволяющая подключаться к БД.
- Далее переходим на вкладку Create Tables, и жмем одноименную кнопку, это действие создаст таблицу на сервере.
- Далее переходим в раздел MIGX и создаем поле, с помощью одного из методов описанных выше, либо используем таблицы в собственном снипете.
Видео о связи БД и MIGX (немного устарело)
Migx в Migx
В поле типа Migx можно поместить другое поле Migx. Для этого при указании типа поля в InputTV надо указать код нужного TV. Для примера рассмотрим два TV поля: tvBooks и tvChapters:
// Вкладки формы для tvBooks
[
{"caption":"Книги", "fields": [
{"field":"bookName","caption":"Название книги"},
{"field":"bookChapters","caption":"Главы книги","inputTV": "tvChapters"}
]}
]
// Вкладки формы для tvChapters
[
{"caption":"Главы", "fields": [
{"field":"title","caption":"Глава"},
{"field":"text","caption":"Текст","inputTVtype": "richtext"}
]}
]
Для вывода подобных полей на сайте код вывода второго поля надо поместить в чанк вывода для первого поля:
// Вывод данных из поля tvBooks
[[getImageList?
&tvname=`tvBooks`
&tpl=`tpl.tvBooks-list`
]]
// Внутри чанка tpl.tvBooks-list вывод данных из поля tvChapters
[[getImageList?
&value=`[[+tvChapters]]`
&tpl=`@CODE:<h3>[[+title]]</h3>[[+text]]</p>`
]]
Примеры применения MIGX
Подборка конфигураций js для MIGX
{
"field": "hidden",
"caption": "Скрытый?",
"inputTVtype": "listbox",
"inputOptionValues": "да==1||нет==2"
}
/* Данные для TV catalog */
/* Вкладки формы (Form Tabs). Во втором поле указываем название второго поля MIGX */
[{"caption":"Каталог", "fields": [
{"field":"headline","caption":"Заголовок"},
{"field":"images","caption":"Изображения", "inputTV":"catalog-images"}
]}]
/* Разметка колонок (Grid Columns) */
[
{"header": "Каталог","dataIndex": "headline"},
{"header": "Изображения","dataIndex": "images","renderer":"this.renderChunk","renderoptions":[{"MIGX_id":1,"name":"rendererCatalogImages"}]}
]
/* Данные для TV catalog-images */
/* Вкладки формы (Form Tabs) */
[{"caption":"Изображения", "fields": [
{"field":"images","caption":"Изображение","inputTV":"image"}
]}]
/* Разметка колонок (Grid Columns) */
[{
"header": "Изображение","dataIndex": "images","renderer":"this.renderImage"
}]
/* Чанк rendererCatalogImages */
[[!rendererCatalogImages?val=`[[+images]]`]]
/* Сниппет rendererCatalogImages */
<?php
$gal=json_decode($scriptProperties['val']);
$out='';
foreach($gal as $item){
$out.='<div style="display:inline-block;">
<img style="max-width:150px;max-height:150px;" src="../assets/upload/img/'.$item->images.'">
</div>';
}
return $out;
Пример фрагмента кода с вымышленным dataIndex, для создания ячейки координат:
{
"MIGX_id":3,
"header":"Координаты",
"dataIndex":"renderCoord",
"width":130,
"sortable":1,
"show_in_grid":1,
"renderer":"this.renderChunk",
"clickaction":"",
"selectorconfig":"",
"renderchunktpl":"x:[[+coord_x]], y:[[+coord_y]]",
"renderoptions":""
},