Обработка событий диалога CkEditor

Я только начал использовать CKEditor, и мне не удается достаточно хорошо понять API, чтобы выполнить то, к чему я стремлюсь.

По сути, у меня есть несколько экземпляров редактора на странице. Однако для редактора по имени htmlInput я хочу собрать имена элементов формы, которые добавляются в редактор. Самое близкое, что я получил, - это всплывающее предупреждение при открытии соответствующих диалоговых окон, но мне не удалось извлечь значение поля имени этих полей.

Вот что у меня есть до сих пор.

CKEDITOR.on('dialogDefinition', function (e) {
    var dialogName = e.data.name;
    var dialog = e.data.definition.dialog;

    if(e.editor.name == 'htmlInput' && (dialogName=='checkbox' || dialogName=='radio' || dialogName=='textfield' || dialogName == 'textarea' || dialogName == 'select'))
    {
        dialog.on('show', function (ev) {
            alert('here');
        });
    }
});

javascript ckeditor
person user1620902    schedule 07.01.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

То, что вы пытаетесь сделать, очень небезопасно. Представьте, что если бы кто-то вставил такой элемент формы или воспользовался методом editor.insertHtml(). Их не соберут. Лучший подход заключается в следующем:

var form = {};

CKEDITOR.instances.editor1.dataProcessor.htmlFilter.addRules({
    elements: {
        $: function( element ) {
            if ( element.name in { 'input' : 1, 'textarea': 1, 'button' : 1 } ) {
                if ( !form[ element.name ] )
                    form[ element.name ] = [];

                form[ element.name ].push( element );
            }
        }
    }
});

Теперь, когда вы можете в основном сделать следующее:

CKEDITOR.instances.editor1.getData();
console.log( form );

Затем вы извлечете все элементы формы (или элементы любого типа), принадлежащие документу. Просто убедитесь, что ваш объект form пуст при сериализации форм, т.е. htmlFilter также выполняется при переключении между режимом источника ‹-> wysiwyg, и он будет постоянно заполнять ваш список.

Вы также можете использовать следующее для извлечения элементов по имени тега (простой способ IMO):

CKEDITOR.instances.editor1.document.getElementsByTag( 'input' );
person oleq    schedule 07.01.2013
comment
Как мне узнать имена элементов? Например, если бы был элемент ‹input type=text name=test value=test2 /›, я могу получить значение, используя element.attributes.value. Когда я набираю element.name, я получаю «ввод», а когда я набираю element.attributes.name, я получаю undefined. Как мне получить строку «тест»? - person user1620902; 19.01.2013
comment
Хм.. Я вижу, что это работает немного, но все еще есть проблемы. Например, основной случай, когда я видел, что он не работает, - это когда вы используете кнопки элементов формы, предоставляемые как часть CKEditor, они не всегда обновляются, по крайней мере, мне это не кажется. Я использовал два метода для вызова htmlFilter. Первый — через .getData() — он всегда возвращает значение undefined. Второй — через переключение между исходным режимом и wysiwyg. Это вызывает htmlFilter каждый раз, но, похоже, требуется несколько изменений режима, чтобы не возвращать значение undefined. Я пытался использовать скрипку с моей конфигурацией - person user1620902; 22.01.2013
comment
и поэтому здесь используется jsFiddle, и вот на моем сайте, где кнопка вызывает getData() для htmlФильтр - person user1620902; 22.01.2013