Как правильно обновить div с помощью jquery / ajax, который содержит форму? - PullRequest
Новая
       27

Как правильно обновить div с помощью jquery / ajax, который содержит форму?

2 голосов
/ 21 января 2012

Я довольно далеко уже написал весь мой код.Я не совсем уверен, если вам нужно увидеть это, чтобы получить представление.

В основном я использую основные: 

$("#formToLoadPageInto").load("thePageToLoad.php").fadeIn("fast");

Теперь это работает и все, нозагруженная страница имеет форму.Он работает в первый раз (отправляет форму), прежде чем использовать эту загрузку, но после этого (когда он перезагружается с этим кодом) форма на странице, которая была перезагружена, больше не отправляется.Я читал, что вы не должны помещать подобные вещи в тело $(document).ready(function(){, но это фактически оставалось вне этого все это время.Так что я действительно не уверен, что может быть не так.

Все основано на том, чтобы не обновлять страницу ... Мне удалось сделать это до сих пор, но эта проблема (и некоторые связанные) удерживают меняобратно!Надеюсь, что кто-то может мне помочь ..

РЕДАКТИРОВАТЬ:

Может быть, это поможет:

У меня есть 2 разных div - "оставить комментарий" и"отправленные комментарии".

В разделе комментариев к комментариям есть форма для отправки комментария.Это php-страница, загруженная в div.Это отлично работает.Когда форма отправлена, она использует этот код: 

$("#newpost").validate({
        debug: false,
        submitHandler: function(form) {
            // do other stuff for a valid form
            $.post('postthought.php', $("#newpost").serialize(), function(data) {
                $('#hideload').html(data);
            });
        }
});

После этого я пытаюсь перезагрузить div опубликованных комментариев (который содержит форму в php, которая загружает все опубликованные комментарии для просмотра иудалить) с помощью 

$("#formToLoadPageInto").load("thePageToLoad.php").fadeIn("fast");

, как указано выше.Он работает и показывает новый контент, но я не могу использовать форму на ЭТОЙ странице для просмотра или удаления комментариев ..

Надеюсь, это не слишком смущает ..

Ответы [ 3 ]

0 голосов
/ 21 января 2012 
$("#formToLoadPageInto").empty().load("thePageToLoad.php?" + Math.random()).fadeIn("fast");
0 голосов
/ 22 января 2012

Звучит так, как если бы div «оставленные комментарии» (который содержит новую форму для просмотра / редактирования) просто вставлен в DOM, но вы не инициализируете его элементы управления JavaScript.

Например, если форма имеет список комментариев и кнопку «редактировать» для каждого из них, в обработчике готовности DOM будет работать что-то вроде этого: 

$('#formToLoadPageInto').on('click','form input[name="editButton"]', function() {
    var $this = $(this);
    var formData = {
        commentID: $this.val(), 
        commentBody: $this.siblings('textarea').text()
    };
    $.post('editComment.php', formData, function(response) {
        //....
    });
});

(при этом используется делегирование для «предварительной привязки» одного обработчика событий ко всем текущим и впоследствии вставленным элементам управления, соответствующим данному селектору.)

0 голосов
/ 21 января 2012

Если сама форма заменяется, вам нужно либо повторно применить обработчик для отправки формы, либо использовать обработчик, который делегирован элементу (возможно, самому документу), который не подлежит замене. 

$('#formToLoadPageInto').on('submit','form', function() {
     ... do submission...
     $('#formToLoadPageInto').load('thePageToLoad.php').fadeIn('fast');
});
...