Отобразить поля модуля в Sitefinity, используя условия в бэкэнде

Я ищу способ показать поля модуля условно на внутреннем экране Sitefinty.

Например, скажем, я создал модуль через конструктор модулей - и у меня есть два поля: флажок и текстовое поле.

Я хотел бы, чтобы текстовое поле отображалось только в редакторах контента только после того, как они установили флажок. В идеале этот флажок может скрывать / показывать несколько полей на месте в процессе ввода контента.

  • Есть ли простой и понятный способ сделать это?
  • В настоящее время используется версия 10.2, было бы здорово узнать, как это сделать с помощью нового и старого пользовательского интерфейса.
  • Надеюсь, что есть расширенные настройки, о которых я просто не знаю, но
    готов пойти на подход JS, а также.

Спасибо!

1 ответ

После небольшого копания я смог найти рабочее решение. Вот как я справился с этим:

Примечание: [module] и [section] предполагают имя и раздел вашего пользовательского модуля. Если вы не настроили разделы в backend screens and tweaks тогда все поля будут под MainSection

Шаг 1 - Добавьте пользовательский скрипт в модуль в расширенных настройках.

Предполагая, что это динамический модуль...

Создайте файл JS в своем проекте и укажите его в дополнительных настройках, перейдя по ссылке:

Advanced settings > Dynamic Modules > Controls > [module] > Views > [Module]View > Scripts

Нажмите Create New и укажите местоположение скрипта для файла JS, который вы создали.


Шаг 2. Добавление пользовательских классов в ваши поля

Оставайтесь на месте в расширенных настройках и переходите к полям, которые вы сделали. Например:

Advanced settings > Dynamic Modules > Controls > [module] > Sections > [Section] > Fields > [Field]

На этой странице прокрутите вниз до CSS Class и добавьте пользовательский класс CSS в это поле


Шаг 3 - Добавьте ваш собственный Javascript

Sitefinity использует jQuery, поэтому я поработал над этим и установил несколько действительно базовых JS, основанных на именах классов:

$(document).ready(function(){
    $('.myTextBox').hide();

    $('.myCheckbox input').on('change', function(){
        var $this = $(this),
            textBox = $('.myTextBox');

        $this.is(':checked') ? textBox.show() : textBox.hide();
    })
});

Примечание: пользовательский класс CSS применяется к родительской оболочке фактического элемента

Теперь, когда редактор контента собирается добавить новый элемент контента в модуль, при установке этого флажка будет отображаться и скрываться настраиваемое текстовое поле.

Помимо того, что этот процесс кажется немного чрезмерным, есть еще несколько проблем:

  • Вы должны установить вызов вашего собственного скрипта в режиме редактирования и вставки.
  • Не учитывает никакой проверки.
  • С Sitefinity, получающей обновление пользовательского интерфейса бэкэнда, долгосрочная устойчивость сомнительна.

Я оставлю этот вопрос без ответа на некоторое время, если есть лучший / более легкий подход к этому.

Другие вопросы по тегам