Документация MIGx

Здесь представлен перевод статей с rtfm.modx.com, а также добавлен из некоторых других источников. Если вы нашли ошибку или опечатку, напишите об этом в комментарии.

Что такое MIGX?

MIGX это специальный тип дополнительных полей (TV), созданный для того чтобы объединить несколько разных TV в один. Такая система объединенных полей очень сильно упрощает администрирование сайта, когда есть необходимость заполнять много информации. Поля ввода в MIGX могут быть всеми стандартными типами - Текст, цифра, выпадающий список, картинка, чекбокс и пр.

Пакет позволяет разработчику гибко настроить структуру и набор используемых полей ввода в рамках одного MIGX-поля.

Дополнение поставляется со снипппетом getImageList, который позволяет быстро и просто вывести данные из заполненного дополнительного поля MIGX

MIGX расшифровывается как MultiItemsGridtv for MODX

Как работает специльный тип дополнительных полей (TV) MIGX

MIGX позволяет хранить сложную структуру данных в едином TV-поле. Данные хранятся в формате JSON. Данная документация предполагает, что вы имеете представление о том, что такое JSON.

Создание первого TV MIGX

Заготовка для конфигурации MIGX находится в директории /core/components/MIGX/examples/. В нижеследующем примере мы будем использовать заготовку "tabs.txt". Эта документация предполагает, что у вас установленно дополнение TinyMCE.

Файл tabs.txt содержит пример реализации простой галереи изображений. Галерея будет состоять из единого элемента, который объединяет в себе одно текстовое поле с редактором (описание изображения), одно поле изображения (само изображение), и короткую строку (заголовок). Все эти данные будут храниться в одном TV-поле.

Шаг 1: Создайте TV MIGX

  • Заполните название, заголовок и все остальное как у любого другого TV-поля.
  • Укажите к какому шаблону относится TV-поле
  • Укажите тип ввода - MIGX

Шаг 2: Настроить поля ввода MIGX
Шаг 2.1: Вкладки формы

Вкладки формы определяет какие поля ввода будут предоставлены пользователю.

Скопируйте содержимое tabs.txt в поле "Вкладки формы"

[
{
    "caption":"Info",
    "fields": [
        {
            "field":"title",
            "caption":"Title"
        },
        {
            "field":"description",
            "caption":"Description",
            "inputTVtype":"richtext"
        }
    ]
},
{
    "caption":"Image",
    "fields":[
        {
            "field":"image",
            "caption":"Image",
            "inputTVtype":"image",
            "sourceFrom":"MIGX"
        }
    ]
}
] 

Сейчас мы разберем этот JSON на составляющие чтобы понять что есть что.

  • Первый ключ "caption" отвечает за то какой заголовок будет у вкладки. В данном случае - "Info".
  • Второй ключ "fields" Содержит информаци о полях, доступных для редактирования в этой вкладке.
    • Первый ключ элемента fields - "field". Значение этого ключа соотвествует имени плейсхолдера при выводе данных через getImageList.
    • Второй ключ элемента fields - "caption". Это заголовок, который увидит пользователь, заполняющий данные в панели управления.
    • Третий ключ элемента fields - "inputTVtype". Позволяет указать тип TV (ДАТЬ СПИСОК)(по-умолчанию "text")
    • Во второй вкладке мы указали "inputTVtype":"image" для того чтобы можно было загружать изображения.
    • "sourceFrom":"MIGX" - если нужно чтобы изображения брались из предустановленного в настройках TV-поля источника файлов.

Ключи для "Вкладки форм"

Ключ Описание
field Имя плейсхолдера, которое можно будет использовать в шаблоне при выводе через getImageList.
caption Заголовок для поля ввода в панели управления.
description Описание поля ввода в панели управления.
inputTV Почти то же самое, что и inputTVtype. Используется для определения типа ввода (по-умолчанию "text"). Применяется если требуется указать какие-то специфические настройки, такие как значения по умолчанию, параметры вывода и пр. You can use the same input TV for different fields (ie, if you have an object that has multiple images).
inputTVtype Почти то же самое, что и inputTV. Используется для определения типа ввода (по-умолчанию "text"). Применяется если НЕ требуется указать какие-то специфические настройки.
default The default value of that field.

Шаг 2.2: Разметка колонок

Мы размечаем колонки чтобы дать пользователю общее представление о том, что содержится внутри элемента.

Скопируйте содержимое columns.txt в поле "Разметка колонок"

[
{"header": "Title", "width": "160", "sortable": "true", "dataIndex": "title"},
{"header": "Image", "width": "50", "sortable": "false", "dataIndex": "image","renderer": "this.renderImage"}
]

Ключи для "Разметки колонок"

Ключ Описание
header Название столбца
sortable Можно ли сортировать столбец?
dataIndex Поле, которое вы хотите вывести в этом столбце (значение ключа "field" из Вкладки форм)
renderer Можно использовать средства визуализации для каждого столбца. Например, для того чтобы отображить миниатюры изображений в таблице, должна быть включена функция "this.renderImage".
Возможные значения параметра renderer:
this.renderimage
this.renderImageFromHtml
this.renderPlaceholder
this.renderFirst
this.renderLimited
this.renderCrossTick
this.renderClickCrossTick
this.renderSwitchStatusOptions
this.renderPositionSelector
this.renderRowActions
this.renderChunk
ImagePlus.MIGX_Renderer
this.renderDate
this.renderOptionSelector
editor Cell Editor:
For ingrid-editing, select an Editor for this column.
this.textEditor - simple Text-input
this.listboxEditor - shows a listbox with the input-options of that field

Ввод данных

Шаг 1: Установка

Убедитесь, что вы установили MIGX, настроили MIGX TV, применили его к шаблону, и создал ресурс с этим шаблоном.

Шаг 2: Ввод данных

  1. Зайдите в ваш ресурс, а затем перейдите на вкладку "Дополнительные поля". Вы должны увидеть новое дополнительное поле.
  2. Нажмите на кнопку "Добавить"
    Заполните поля, которые вы определили в настройках дополнительного поля. Если вы не видите никаких полей, убедитесь, что заполнили поле "Вкладки формы" соблюдая синтаксис JSON (Иногда при копировании примеров вы можете вставить неразрывные пробелы вместо обычных, в таком случае JSON не будет валидным)
  3. Нажмите кнопку "Готово"
  4. Нажмите кнопку "Сохранить", чтобы сохранить ресурс

Шаг 3: Изменение данных

Щелкните правой кнопкой мыши на любом элементе. Выберите либо Update, дублировать или удалить.

Шаг 4: Упорядочивание данных

Зажмите и перетащите элемент, чтобы изменить его положение в таблице.

Вывод данных через getImageList

Отображение элементов MIGX

В комплекте с пакетом MIGX поставляется сниппет getImageList, который подходит для вывода данных из заполненного TV MIGX. Не смотря на название он может быть использован не только для вывода изображений, но для всех типов данных. Это что-то вроде getResources, но специально для MIGX.

getImageList может быть использован для организации любой структуры данных, например:

  • галерея изображений
  • слайдер с картинками или HTML
  • табличные данные
  • CSV или XML
  • Что угодно на самом деле

Пример использования getImageList

Давайте выведем изображения, которыми мы заполнили TV MIGX на шаге 2. Вставьте этот код там, где вы хотите увидеть картинки.

    [[getImageList? &tvname=`myMIGXtv` &tpl=`@CODE:<li>[[+idx]]<img src="[[+image]]"/><p>[[+title]]</p></li> `]]

tvname - название TV-поля. tpl - шаблон вывода. В tpl вы можете указать как название чанка, так и строку кода. Убедитесь, что указали @CODE:, если решили использовать указать шаблон строчно. При использовании чанка достаточно указать только название этого чанка.

Вывод с использованием RezImgCrop:

<li>
  <img src="[[+image:rezimgcrop=`r-250`]]" alt="[[+title]]"/>
</li>

Вывод MIGX TV внутри шаблона getResources

<li>
  <a href="[[~[[+id]]]]">[[+pagetitle]]</a>  
  [[getImageList?
    &tvname=`myMIGXtv`
    &tpl=`thumbTpl`
    &limit=`1`
    &docid=`[[+id]]`
  ]]
</li>

Использование переменных из getResources в getImageList

Если вы хотите использовать переменные, поставляемые в шаблон getResources внутри шаблона getImageList вы можете передать эти данные в параметрах вызова getImageList. Вы можете задать произвольные имена этим параметрам, а вызывать их с помощью конструкции [[+property.myparam1]] в шаблоне getImageList.

[[getImageList?
    &tvname=`myMIGXtv`
    &tpl=`thumbTpl2`
    &docid=`[[+id]]`
    &limit=`1`
    &pagetitle=`[[+pagetitle]]`
    &originalResourceId=`[[+id]]`
]]
<li>
    <a href="[[~[[+property.originalResourceId]]]]">Показать еще изображения от [[+property.pagetitle]]</a>
</li>

Параметры сниппета getImageList

Ключ Описание
tvname Название дополнительного поля, которое нужно вывести
tpl Название чанка для вывода. Можно также использовать конструкции @CODE: или @FILE:. Если оставить поле пустым, то будет выведен массив (как через pront_r в php)
wrapperTpl Название чанка-обертки для результата работы сниппета. Принимает только один плесхолдер — [[+output]]. Как вывести getImageList только если он не пустой
docid ID ресурса, дополнительное поле которого нужно вывести. Пригодится при выводе в шаблоне getResources: &docid=`[[+id]]` [[*id]]
value Можно указать данные в формате JSON, вместо использования данных из TV-поля. Если указан, то docid и code{ignored} игнорируются.
limit Если не ноль, то указывает сколько выводить элементов 0
offset Кол-во элементов, которые нужно пропустить. 0
totalVar Плейсхолдер, содержащий общее количество элементов. Полезно при использовании getPage. total
randomize Укажите &randomize=`1` если хотите организовать вывод в случайном порядке 0
preselectLimit together with &randomize, this will preselect items from top to limit, for images you want to see in any case in ranomized output 5
where Отфильтровать элементы. Пример:
{"active:=":"1","rating:>":"5"}
sort Сортировка может быть по нескольким полям одновременно. Пример:
[{"sortby":"age","sortdir":"DESC","sortmode":"numeric"},
{"sortby":"name","sortdir":"ASC"}]
toPlaceholder Название плейсхолдера, в который следует поместить результат работы сниппета. К примеру есть указать &toPlaceholder=`MIGX`, то результат будет доступен в [[+MIGX]]. Примечание переводчика — почему-то этот плесхолдер не проходит проверку на пустоту. Чтобы решить эту проблему пользуйтесь wrapperTpl
toSeparatePlaceholders Разделяет результат работы сниппета на отдельные плейсолдеры. Например есть указать &toSeparatePlaceholders=`MIGX`, то результат ля каждого элемента будет сохранен в отдельном плейсхолдере: [[+MIGX.1]] [[+MIGX.2]] ......
placeholdersKeyField Применяется только в связке с &toSeparatePlaceholders. Пример: &placeholdersKeyField=`title` - получим [[+MIGX.firsttitle]] [[+MIGX.thirdtitle]] ......
outputSeparator Разделитель у элементов
toJsonPlaceholder output items as json into a placeholder, usefull when you want for example show randomized items on different places.
example: &toJsonPlaceholder=`jsonoutput` -> [[getImagelist? &value=`[[+jsonoutput]]`................]]
jsonVarKey example: &jsonVarKey=`MIGX_json` - this will use the value from $_REQUEST['MIGX_json'] as value, if any
useful together with the backend-preview-feature
MIGX_outputvalue

Доступные плейсхолдеры в шаблоне вывода getImageList

Ключ Описание
[[+fieldname]] Подставьте вместо 'fieldname' заданное вами значение поля
[[+idx]] Индекс текущего элемента. Начинается всегда с 1
[[+_first]] Содержит 1 если это первый элемент
[[+_last]] Возвращает 1 если это последний элемент
[[+_alt]] Возвращает 1 для каждого второго элемента
[[+total]] Возвращает общее кол-во элементов, можно заменить 'total' настройкой &totalVar
[[+property.name]] Можно использовать любые переданные параметры. К примеру если вы указали &docid=`20`, то [[+property.docid]] вернет 20

Продвинутое использование

Динамическая замена шаблона

Используя &tpl=`@FIELD:` можно установить любое поле шаблоном для вывода.

[[getImageList?
 &tvname=`myMIGXtv`
 &tpl=`@FIELD:mytplfield`
]]

Если вы определили поле "mytplfield" в настройках MIGX TV, getImageList будет использовать значение этого поля как шаблон для вывода данного элемента. Шаблон внутри поле "mytplfield" должен быть точно таким же, как содержание чанка, используемого обычно в &tpl=`chankname`.

Способ поблагодарить автора сайта:

Добавить комментарий

Евгений 17 апреля 2018, 20:54

Что делать если в TV нет migx в выпадающем списке "Тип ввода"? MIGX установлен, но его нет в списке tv поля

Администратор

Может быть вы просто скачали MIGX пакет, но не установили его?...

Комментарии старого формата:
  1. 30/12/2016 в 10:16 Александр:

    Подскажите, плиз, как можно вывести значение migx внутри другого migx

    Есть TV-поле catalog: https://yadi.sk/i/TObuXKxZ35VjJe С этим моментов все ок, данные записываются и в админке отображается все как надо https://yadi.sk/i/Ug4wXZYX35VkFz

    Вопрос, как прописать, чтобы все это дело выводилось на сайте.

    В шаблоне сам каталог выводится вот так:


    Все выводится, кроме значений вложенного MIGX. А содержимое TV catalog содержит вот такой код для вывода значений price_elements:

    `&tpl=`catalogItemPrice`

    Как сделать так, чтобы все заработало?

  2. 06/01/2017 в 01:38 tooladmin:

    Александр, чтобы указать MIGX внутри MIGX нужная приблизительно такая конструкция:
    Первый вызов:
    [ [getImageList? tvname=`migx_tvname` tpl=`migx_tvname_tpl`]]
    Второй вызов в чанке migx_tvname_tpl:
    [ [getImageList? tvname=`[ [+migx_tvname]]` tpl=`migx_tvname_tpl2`]]
    О том, что такое value можно почитать выше в документации

  3. 06/01/2017 в 01:44 tooladmin:

    Александр, а вообще я в подобной ситуации обычно все вывожу в отдельные ресурсы - так удобнее, хотя может быть ситуации бывают разные.

  4. 30/01/2017 в 12:59 Александр:

    Здравствуйте, подскажите пожалуйста, как вывести MigX в данном случаи?

    " alt="">`
    &docid=``






    {$pagetitle}


    Описание
    {$content}


    `
    &limit=`8`
    &includeTVs=`imageCatalog`
    &tvPrefix=``
    &includeContent=`1`
    &sortdir=`ASC`
    &tplPageWrapper=`@INLINE `
    &tplPagePrev=`@INLINE `
    &tplPageNext=`@INLINE `
    &tplPagePrevEmpty=`@INLINE `
    &tplPageNextEmpty=`@INLINE `

  5. 16/02/2017 в 19:03 Евгений:

    Подскажите пожалуйста. MODx Revo, Shopkeeper3, товары через MIGX, не через ресурсы. Ресурсы в качестве категорий.
    как вывести кол-во товаров в категории на главную.
    Есть:
    -Ручки
    -Карандаши
    -Ластик

    Надо:
    -Ручки (6)
    -Карандаши (5)
    -Ластик (10)

  6. 17/03/2017 в 12:06 Руслан:

    Первый раз наткнулся на ваш сайт. Спасибо за перевод, его очень не хватало!!

  7. 10/08/2017 в 14:38 Аркадий:

    Здравствуйте!
    Подскажите пожалуйста, можно ли создать поле с выбором альбома галереи плагина Gallery?

[MODx] Подсказки по API

[MODx] minishop2 tips

[Code helper] Заготовки для работы

[MODX] Добавить скрипт перед тегом body

[PHP] Узнать скорость выполнения кода. Простой таймер PHP

Вывести список всех емэйлов miniShop2

[MODX] Создать редирект через autoRedirector API

[MODX, MiniShop2] Отредактировать шаблон письма

[MODX] Кастомный чанк для AdminPanel

[MODX] Оформление и настройка easyComm. Комментарии и отзывы на сайте.

[MODX, MiniShop2] Обязательный чекбокс при оформлении заказа

[JS] Маска для ввода телефона +7(___)___-__-__

[MODX, MiniShop2] Добавить в письмо контактную информацию

[MODX, MiniShop2] Email сделать не обязательным полем

[MODX] Импорт и экспорт в MiniShop2. Реализация 1

[MODX, MiniShop2] Изменить формат номера заказа

Изменить цену на товар в зависимости от количества при добавлении в корзину minishop2

Общая сумма по каждому товару в корзине Minishop2

reCaptcha не через форму (без тега <form>)

Расширение свойств товаров minishop2

pdoPage и getImageList - Постраничная навигация MIGX

[MODX] Соответствие названия классов с названиями таблиц в MySQL

Вывести 404 ошибку по настройки TV MODX

Расширить таблицу site_content (объект modResource) за 5 минут

Передать файл с одного на другой сервер

Создать ресурс процессором $modx->runProcessor('resource/create', $props)

Как включить HTTPS (SSL) в MODX - Подробная инструкция

[MODX, MIGX] Простейшая авторизация

[MIGX] Простая и симпатичная галерея fancybox

[MODX] Узнать размер файла

Красивое адаптивное меню под pdoMenu

pdoResources Заготовки для работы

FontAwesome - часто используемые иконки для шаблонов MODX

[MODX, MIGX] Тип поля "Список ресурсов" (resourcelist) с ограничением по родителю (parents)

[MODX, MIGX] Вывести getImageList только если он не пустой

Bxslider отображение картинок после полной загрузки слайдера

[MODX] Вывести список всех опций MiniShop2

[MODX] Курсы валют с cbr.ru на PHP

[MODX, MIGX] Простой аудио-плеер HTML5

Как контролировать кэш CSS и скриптов

[OpenCart] Вывести на главную все категории с картинками

[PHP] Получить древовидный массив за один запрос к базе

Вырезать кавычки - фильтр MODx

Регулярное выражение

[MODx] Генератор настроек MIGX

[MODx, MIGx] Документация на русском по MIGx

[MODx] Динамическое поле emailSubject в FormIt

[MODx] Установить шаблон по-умолчанию для новых, создаваемых ресурсов

[MODx,MiniShop2] Не приходит почта администратору

[MODx] Баннеры с использованием BannerY

[Opencart] Вернуть английский язык, если вы его удалили

Универсальная форма обратной связи — feedBackForm

[MODx, miniShop2] Генерация YML для выгрузки в маркет

Редиректы

[MODx] pdoPage pagination css

[MODx] Вывести время загрузки (формирования) страницы

[MODx] Создать источник файлов

[MODx, minishop] Фильтрация по TV параметрам в msProducts

Регулярные выражения notepad++ примеры

[MODx] Создать свою страницу в админке

[JS] Заготовочки

[MODx] Поиск на сайте с пакетом SimpleSearch

[MODx, XML] Ответ для сервиса moneta.ru

[MODx] Подключить MODx в стороннем PHP файле

[MODx] Создать пакет с пользовательской таблицей

[PHP] Простое логирование

[OpenCart] Вывести модуль напрямую через контроллер

[MODx, Gallery] Галерея. Вывести обложки альбомов и фотографии

[MODx, MIGX] Примеры использования

[MODx] Сайт на обслуживании (выключить сайт)

[Opencart, FilterPro] Не работает пагинация

[OpenCart] Заготовки для автоматического заполнения товарами магазина 1.5.5.1.2

[PHP] Разные фишки, заготовки

[PHP, JSON] Пример перевода с помощью Yandex Translate API

[MySQL] Примеры запросов

[MODx] Вывод tv-параметров в формате [название TV] - [значение TV]

[MODx] Дата на русском

[MODx] Ускорить установку MODx revo до пары кликов

[Opencart] API tips

[MODx, Quip] Отсортировать ресурсы по количеству комментариев Quip MODx

[PHP] Загрузить файл для постобработки

[Opencart 2] Показывать в категориях

[MODx, Quip] Более рабочий вариант.

[MODx] Получить grandparent. Вывести родитель родителя

[MODx] Вывести все доступные плейсхолдеры.

[MODx] getResources заготовки

[MODx] Счетчик посещений и скачиваний для сортировки ресурсов

[MODx] Как разместить исходный код сниппета на сайте, в документации

Удалить HTML-теги span, и стили из тега br

Полезные ссылки

Все записи

20833