• Блог
  • Подключаем Ace к полям ресурса

На сайте сообщества задали вопрос о том, как подключить редактор кода к полям description и introtext. В своё время я для себя решал такую задачу для поля introtext. Вот делюсь немного доработанным решением как подключить Ace к любым текстовым полям формы ресурса.

Создаём плагин и вешаем его на событие OnDocFormPrerender.

<?php
switch ($modx->event->name) {
    case 'OnDocFormPrerender':
        if (!$modx->controller->resourceArray) {
            return;
        }
        // Указываем поля, для которых будет подключаться Ace
        $fields = array('modx-resource-introtext','modx-resource-description');
        $mimeType = $modx->getObject('modContentType', $modx->controller->resourceArray['content_type'])->get('mime_type');
        if ($mimeType == 'text/html' && $modx->getOption('pdotools_fenom_parser')) {
            $mimeType = 'text/x-smarty';
        }
        $modxTags = 1;
        $script = '';
        foreach($fields as $field) {
          $script .= "MODx.ux.Ace.replaceComponent('$field', '$mimeType', $modxTags);";
        }
        $script .= "MODx.ux.Ace.replaceTextAreas(Ext.query('.modx-richtext'));";
        // Увеличиваем поле introtext
        $script .= "Ext.getCmp('modx-resource-introtext').setHeight(150);";
        $modx->controller->addHtml('<script>Ext.onReady(function() {' . $script . '});</script>');
        break;
    default:
        return;
}

Данное решение пригодится и для элементов. Нужно лишь изменить событие плагина и mimeType элемента. Подсмотреть это можно в оригинальном плагине Ace.

0   3738

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

  1. Роман 21 мая 2018, 00:25 # 0
    Доброго времени суток! Подскажите, есть ли возможность подключить редактор Ace к TV полям? За ранее спасибо за ответ!
    1. Сергей Шлоков 21 мая 2018, 10:36 # 0
      Думаю да. Подключить можно к любому доступному textarea.
      1. Роман 21 мая 2018, 11:44 # +1
        Сергей, огромное спасибо за исчерпывающий ответ! А могли бы вы подсказать(не на словах, а примером кода), как это сделать? За ранее спасибо за ответ!
    2. Eiry 22 августа 2019, 23:12 # 0
      Спасибо за плагин! Прикручиваю его к сайту, но возникает проблема: поле ввода на одну строчку вверх залезает под табы, к тому же не видно и заголовка над ним. И в админке текст виден узкой колонкой, но потом после рандомных кликов расползается по полю как надо. С чем может быть связан такой баг? Как его решить?
      Вот скриншот:
      yadi.sk/i/vBSNSQB4q97Ftw

      В плагине ничего не менял, кроме названия поля.
      Надеюсь на помощь, т.к. заказчик уже мозг взрывает ;(
      1. Сергей Шлоков 24 августа 2019, 12:55 # 0
        Если честно, не имею ни малейшего понятия. Нужно идти последовательно. Что в консоли браузера?
      2. Eiry 24 августа 2019, 13:35 # 0
        В консоли браузера:
        Uncaught TypeError: Cannot read property 'setHeight' of undefined
        at ?a=resource/update&id=7333:272
        at ext-all.js:21
        at b (ext-all.js:21)
        Это ругань на строку:
        $script .= «Ext.getCmp('modx-resource-info_text').setHeight(150);»;
        info_text — это моя твшка. Похоже, я неправильно пишу её в аргумент getCmp.
        Но здесь: $fields = array('modx-resource-info_text'); проходит…
        Попробовал закомментировать эту строку, ругань исчезла, но ничего не изменилось в админке.

        После ctrl+F5 поле и заголовок к нему перестали залезать под табы, видимо, что-то не так закешировалось. Но текст в узкую колонку остался. Он расползается как надо еще и при открытии консоли браузера.

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

        Выделите опечатку и нажмите Ctrl + Enter, чтобы отправить сообщение об ошибке.