jQuery, отправьте текстовое значение текстового редактора с помощью ajax?

Question

Не удалось опубликовать значение textarea с помощью ajax в elRTE текстовом редакторе.

Демонстрационная страница редактора похожа на приведенную ниже;

http://elrte.org/demo

и я использую код ниже;

$.ajaxSetup({
    type: "POST",
    url: "forms.php",
    cache: false,
    dataType: "html"
});

$("input.add").live("click", function(){
    $.ajax({
        data: {action: 'add', tag: $('input.tag').val(), description: $('#editor').val()},
        success: function(data){
            $("#message").html(data);
        }
    });
});

Я пробовал несколько разных способов отправить значение textarea, но не смог достичь.

Answer 1

Просто бегло взглянув на вашу демонстрационную страницу, я замечаю, что ваша #editor "textarea" на самом деле не текстовая область, а DIV, похожая на текстовую область. Так что $('#editor').val() не будет работать. Я бы предложил вместо этого использовать $('#editor').html(), но #editor не является фактическим div редактора, так что на самом деле вы не получите того, кем хотите быть. Ответ Shyju делает это правильно, выбрав фактический div и используя .html(), чтобы получить контакт.

Но я только что посмотрел на сайт немного дальше, и, похоже, есть API-интерфейс javascript, позволяющий легко получить нужные данные: $('#editor').elrte('val'); http://elrte.org/redmine/projects/elrte/wiki/JavaScript_API_EN

Другая проблема, с которой вы можете столкнуться, заключается в том, что в данный момент вы выполняете запрос ajax через GET (метод по умолчанию), но поскольку значение описания может быть очень большим, оно может быть слишком большим для ограничения максимальной длины URL. Я бы предложил использовать POST вместо GET для вашего запроса ajax. Т.е.: тип: "POST"

Answer 2

Я мог видеть, что у div есть класс с именем "el-rt-structure". Попробуйте выбрать элемент с помощью этого и получить внутренний HTML-код с помощью функции html ()

$("input.add").live("click", function(){
  var textAreContent=$(".el-rte-structure").html();
    $.ajax({
        data: {action: 'add', tag: $('input.tag').val(), description: textAreContent},
        success: function(data){
            $("#message").html(data);
        }
    });
});