Отправляется пустое сообщение через форму с помощью AJAX. Ваши предположения?

Question

[Monster Hide]

Приветствую!

Подскажите пожалуйста, может кто знает, сталкивался.
Есть форма отправки сообщения в базу:

<form>
...
</form>

Есть AJAX скрипт, который обрабатывает форму после клика по кнопке Отправить.
Функция данного скрипта, отправка данных в БД и вывод отправленного текста из формы на странице без перезагрузки страницы.
Допустим как в ВК... Написал, отправил, появился результат.
Все работает на ура!

Но когда я подключаю к форме редактор, допустим TinyMCE. Или подобный ему...
Отправляется пустое сообщение в базу и через AJAX, так же выводится пустое сообщение.
Если добавить запрет на отправку пустого поля, то выходит предупреждение, что поле пустое.

Вопрос:
В чем может быть причина?
П.С.: Если отключить AJAX скрипт и отправлять данные из формы используя редактор, то все так же проходит на ура!
Но естественно без появления новой информации из базы на странице без обновления. Ибо AJAX скрипт отключен.
Иными словами... Что редактор, что AJAX скрипт. Друг без друга, работают прекрасно!
А когда вместе... Ну никак не хотят дружить!

Выручайте, ребятушки!
С уважением!

Answer 1

[Юрий Ерусалимский]

Предполагаю, что отладка вам поможет. Попробуйте логировать чуть ли не каждый шаг с помощью console.log();. Например, событие нажатия на кнопку, формирование массива данных, отдаваемых на сервер (кстати, тут бы интересно узнать как именно вы записываете данные, через php обработчик?), информация от обработчика, какие данные он принял, информация о передаваемых на внесение данных в БД. Вообще, из своего опыта могу сказать так - в тех случаях, когда у меня появляется проблема, сайт не делает то, что мне надо, я начинаю логировать каждый шаг, сверять данные, которые "путешествуют" между скриптами и т.д. Таким образом и выявляется проблема. Я так, например, поднял сайт на CMS Joomla, выяснив, что движок сайта на определённом этапе запрашивает файл, который был удалён намеренно хакером. А ведь, всего-то, больше отчётности в консоли разработчика.

Comments

[Monster Hide]

Спасибо за ответ! Да, отправка данных в базу происходит через PHP.

Answer 2

[curator]

К примеру:

HTML:

<form method="post">
    <textarea id="text" name="text"></textarea>
    <button type="submit"></button>
  </form>

JS:

tinymce.init({
    selector: '#text'
  });

После инициализации тег textarea будет скрыт и добавлена разметка редактора, где и происходит редактирование текста. При изменении текста в редакторе, в textarea он не изменяется. Вы, скорее всего, получаете содержимое из textarea, отсюда и пустая строка.

Нужно вызвать метод редактора который обновит текст в textarea или получать текст через метод редактора.

К слову, при изменении скриптом содержимого в textarea, в редакторе оно не изменится, нужно тоже вызывать соответствующий метод.

В случае с tinymce, перед получением текста, для ajax отправки, можно вызвать метод
tinymce.EditorManager.triggerSave()

Подробнее в документации.

Comments

[Monster Hide]

Спасибо за ответ!
Содержимое получаю из name="".
Пробовал цеплять редактор не к textarea, а к id. Тоже самое...

[Monster Hide]

В доках нашел эту строку: EditorManager#triggerSave():undefined.
Правда никак не могу понять, куда ее впихнуть.
Это готовая строка, или в скобках должно быть еще какое-то содержимое?
Подскажите пожалуйста!

[curator]

На примере.

// Обработка события "клик" по кнопке отправки сообщения.
$('#sendMsgBtn').on('click', function (e) {

// "перенесет" ваш текст из редактора в textarea
tinymce.EditorManager.triggerSave();

// ... далее ваш код
});

Cодержимое получаете как-то так: $('textarea').val()

[Monster Hide]

curator: благодарю Вас! Все работает!