Получение содержимого текстового поля из формы AJAX

Question

Я использую AJAX для динамического получения комментариев.Этот DIV, который скрыт, заполняется комментариями и формой, а затем становится видимым.Форма используется для добавления новых комментариев в список просматриваемых в настоящее время комментариев (обратно через AJAX).

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

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

У меня есть $('#submit_comment').live('click', function(e) ... для обнаружения кнопки отправки формы AJAX.Это работает.Я просто не могу получить строку в текстовом поле ... это очень раздражает, я пробовал много методов, таких как `var comment = $ ('# new_comment'). Val (); '- это не работает.

Мой HTML включает в себя следующее:

<form id="new_comment" name="new_comment" method="get" action="comments.php">
                <input type="hidden" id="trackID" value="' . $track . '">
                <input type="text" size="25" id="new_comment_text" /><span style="text-align:right">
                <input type="submit" value="Comment" id="submit_comment"/></span>
            </form>

Это отражено в comments.php и хранится внутри плавающего DIV.

Как я могу получить содержимое текстового поля из формы AJAX DIV ??

Вот полный вызов AJAX:

$('#submit_comment').live('click', function(e) {


        e.preventDefault();

        var comment = $('#new_comment_text').val();
        alert(comment);

        if (comment != '') {

            $('#loading').show();
            $('#commentsPanel').hide();
            // loading = true

            var track = $('#trackID').val();

            alert(track);
            var data = 'track=' + track + '&isComment=true&comment=' + comment;
            alert(data);
            $.ajax({
                url: 'comment.php',
                type: 'GET',
                data: data,
                cache: false,
                success: function (comments_html) {
                    alert('submit_comment');
                    $('#commentsPanel').html(comments_html);
                    $('#commentsPanel').show();
                    $('#loading').hide();
                }
            });
        } 
        else { 

        }   
    });

Answer 1

Ваша форма и ввод текста имеют одинаковый идентификатор, поэтому элемент ввода текста имеет уникальный идентификатор и имя.

<form id="new_comment" name="new_comment" method="get" action="comments.php">
    <input type="hidden" id="trackID" value="' . $track . '">
    <input type="text" size="25" id="new_comment_text" name="new_comment_text" /><span style="text-align:right">
    <input type="submit" value="Comment" id="submit_comment"/></span>
</form>

...

var comment = $('#new_comment_text').val(); // Should be the input value.

JSFiddle - http://jsfiddle.net/L74hu/

Answer 2

Может ли быть, что ваше действие против URL не совсем складывается из-за пропущенного s?

form id="new_comment" name="new_comment" method="get" action="<strong>comments.php</strong>"

против

$.ajax({
          url: '<strong>comment.php</strong>',

Answer 3

попробуйте отправить данные в объект, подобный этому:

$.ajax({
    url: 'comment.php',
    type: 'GET',
    data: {data:data},
    cache: false,
    success: function (comments_html) {

        alert('submit_comment');
        $('#commentsPanel').html(comments_html);
        $('#commentsPanel').show();
        $('#loading').hide();
    }
});

потому что $('#new_comment_text').val(); проснулся со мной в передней части

Answer 4

var comment = $('#new_comment').val()

Не будет работать (или, вероятно, нет), потому что у вас дважды один и тот же идентификатор:

form  id="new_comment"
input id="new_comment"

Вы должны использовать другой идентификатор, и он должен быть в порядке.