Примеры

ListChild: Примеры

Примеры cниппетa для формирование динамического списка дочерних документов.

Динамический список дочерних документов

Пример использования в backend (административной панели)

Сниппет сформирует список в виде: параметр1==значение1||параметр2==значение2

Создайте TV-параметр с типом ввода DropDown List Menu.

В возможных значениях укажите:

@EVAL return $modx->runSnippet('ListChild', array('docid' => 10, 'where' => 'isfolder = 1 and hidemenu = 0'));

Отобразит все опубликованные и неудаленные дочерние контейнеры папки 10, которые отмечены для показа в меню.

Или так:

@EVAL return $modx->runSnippet('ListChild', array('docid' => '10,11,12', 'depth' => 2));

Отобразит все опубликованные и неудаленные дочерние документы, в том числе и контейнеры, папок 10, 11 и 12 до второго уровня вложенности.

Выпадающий список (frontend)

Пример использования во frontend (пользовательской части)

Сниппет сформирует список в виде: <option value="значение">параметр</option>

Разместите в шаблоне следующий код:

<form action="04_extras/listchild/03_primery1.html">
    <select class="form-control">
        
    </select>
</form>

Отобразит в виде раскрывающегося списка все опубликованные и неудаленные дочерние документы папки 4, до второго уровня вложенности, которые не являются контейнерами.

Обратите внимание, что в данном примере после выбора из списка любого пункта, форма перегружается и выбранное значение сбрасывается.

Пример использования во frontend с запоминанием выбранных значений

Тегу select добавьте атрибут name. Значение атрибута укажите в соответствующем параметре сниппета.

Важно! Не используйте для разных списков одинаковые значения атрибута name.

<form action="04_extras/listchild/03_primery1.html">
    <select onchange="this.form.submit();" name="dropdown"  class="form-control">
        
    </select>
</form>

Теперь после выбора из списка любого пункта, форма перегружается но выбранное значение сохраняется.

Событие onchange="this.form.submit();" автоматически отправляет данные формы после каждого изменения элемента формы.

Переключатели radio (frontend)

Пример c использованием шаблона в frontend

1. Задача - вывести в виде переключателей.

Шаблон tplRadio:

<div class="col-lg-3 col-sm-4 col-xs-6">
    <div class="radio">
        <label>
            <input type="radio" name="radio" class="colored-blue" value="" onchange="this.form.submit();">
            <span class="text"> </span>
        </label>
    </div>
</div>

Отобразит в виде переключателей все опубликованные и неудаленные дочерние документы папки 4, без пустого поля в начале списка. Запомнит выбранное значение.

Флажки checkbox (frontend)

Пример c использованием шаблона в frontend

Задача - вывести в виде переключателей.

Шаблон tplCheckbox:

<div class="col-lg-2 col-sm-4 col-xs-6">
    <label class="csscheckbox csscheckbox-primary">
        <input type="checkbox" name="checkbox" class="colored-blue" value="" onchange="this.form.submit();">
        <span></span> 
    </label>
</div>

Отобразит в виде переключателей все опубликованные и неудаленные дочерние документы папки 4, без пустого поля в начале списка.

Количество найденных документов

Вывод количества найденных документов

Отобразит количество опубликованных и неудаленных дочерних документов папки 4.

Вывод id найденных документов

Вывод идентификаторов найденных документов

Чанк idTpl:

Отобразит список id всех опубликованных и неудаленных дочерних документов папки 4, разделенных запятой.

Вывод заголовков найденных документов

По аналогии с id документа, можно вывести любую переменную шаблона (кроме TV-параметров). Например, если нужно вывести заголовки:

Отобразит заголовки всех опубликованных и неудаленных дочерних документов папки 4, разделенных запятой с пробелом.

Использование параметра where

При использовании параметра where необходимо заменять все = на @eq. Например, для того, чтобы вывести идентификаторы всех документов с шаблоном 5 и menuindex равным 0, размещаем такой вызов:

Чанк tplId:

Анонс статей или подменю

Выводим анонс статей

<ul></ul>

Чанк tplNews:

<li><a href="[~~]"></a><p></p></li>

Отобразит анонсы трех статей с кратким описанием.

Выводим подменю

<ul></ul>

Чанк tplSubmenu:

<li><a href="[~~]"></a></li>