Как стать автором
Обновить

TinyMCE — получение содержимого редактора.

Время на прочтение2 мин
Количество просмотров3.7K
Хотелось спросить у сообщества совета, так как сам я вследствие неопытности в данном вопросе никак не могу найти решение.

Описываю ситуацию:
Пишу редактор структуры сайта. Сделан он следующим образом: при клике на раздел вслывает окно thickbox, в который загружается редактор раздела, частью которого является TinyMCE. В редакторе присутствует кнопочка «применить», функция которой сводится к сериализации данных формы, отсылки этих данных на сервер, получение ответа и замена этим ответом содержимого thickbox. Выглядит это так:
function submit_form(button) {
var str = $("#edit_form").serialize()+"&"+button+"=true";
$.post("update", str, function(data) {
$("#container").parent().html(data);
});
}

Содержимое TinyMCE не содержится в textarea и, соответственно не сериализуется. Вариантов решения мне видится два: либо копировать содержимое редактора в textarea перед сериализацией, либо как-то сериализовать его отдельно и приаттачивать к посылаемой строке. Вот тут-то и всплывают грабли, на которых я отплясываю уже некоторое время: в TinyMCE не существует ни переменной которая бы просто сожержала контент редактора, ни функции которая бы этот контент возвращала без каких-либо лишних махинаций (ну или я просто её не смог найти — в этом случае ткните меня носом и я отстану от вас, посыпапя голову пеплом). Единственное, что я нашел — это метод getContent, который «Gets the content from the editor instance, this will cleanup the content before it gets returned using the different cleanup rules options.» Я не совсем понимаю смысл этой фразы, но если воспользоваться этим методом так как я это попробовал:
function submit_form(button) {
$("#text").val(tinyMCE.get('text').getContent());
var str = $("#edit_form").serialize()+"&"+button+"=true";
$.post("update", str, function(data) {
$("#container").parent().html(data);
});
}

то при загрузке в thickbox второй раз строчка $("#text").val(tinyMCE.get('text').getContent()); не срабатывает. Редактор есть, содержимое в нем есть, а метод не работает, и соответственно вся функция submit_form() — тоже.

Вразумите молодого падавана, а?

Если нужно каких-то дополнительных сведений — скажите, я дополню.

P.S. Я не являюсь знатоком javascript и использую его только постольку, поскольку приходится и без него — никуда. Поэтому заявления «уйди с глаз долой неумеха» со скорбным видом принимаются, но я рекомендую обойтись без них — это и так понятно. К сообществу я обратился только после того как долго тыкался сам и решения не нашел.

Update:
Проблему удалось решить вот так:
function submit_form(button) {
tinyMCE.get('text').save();
var str = $("#edit_form").serialize()+"&"+button+"=true";
$.post("update", str, function(data) {
tinyMCE.get('text').remove();
$("#container").parent().html(data);

});
}


Ну а контент проще всего получить через tinyMCE.get('text').getBody().innerHTML;

По всей видимости при замене содержимого thickbox создавался новый экземпляр редактора а старый никуда не девался, поэтому надо было использовать remove(), который я поместил в $.post чтобы момент преображения принцессы в лягушку редактора в textarea происходил наиболее незаметно для пользователя.
Теги:
Хабы:
+4
Комментарии11

Публикации

Истории

Ближайшие события

Weekend Offer в AliExpress
Дата20 – 21 апреля
Время10:00 – 20:00
Место
Онлайн
Конференция «Я.Железо»
Дата18 мая
Время14:00 – 23:59
Место
МоскваОнлайн