Обновление div в AJAX без перезагрузки

#php #javascript #html #jquery #ajax

Подскажите, как в AJAX jQuery, сделать обновление одного конкретного 
, без перезагрузки
страницы:

    

 $("#form").submit(function () {


//ajax
        $.ajax({
            url: 'keepComment.php',
            type: "POST",
            cache: false,
            data: $('form').serialize(),
            success: function (data) {


                $('#comments').html(data);
            }

        });

            });


В общем по коду видно, что посылаю я submit(); и мне нужно чтобы во время посылки
submit();, автоматически обновлялся 
.
Как такое можно сделать?
В функции заворачивал, setInterval(); вызывал и т.д., что-то не катит. 
    

Ответы

Ответ 1

Обработчик должен возвращать false, чтобы отменить стандартное поведение отправки
формы на сервер и перезагрузки страницы.

$("#form").submit(function () {
  $.ajax({
    url: 'keepComment.php',
    type: "POST",
    cache: false,
    data: $(this).serialize(),
    success: function (data) {
      $('#comments').html(data);
      // или
      $('#comments').html(append);
    }
  });
  return false; // !!!
});


Ответ 2

Для того чтобы страница не перезагружалась надо добавить прерывание действия.

// не забыть поставить у формы id="form"
$("#form").submit(function (e) {
    // тут мы прерываем текущее действие
    e.preventDefault(e);
    $.ajax({
        url: 'keepComment.php',
        type: "POST",
        cache: false,
        data: $('form').serialize(),
        success: function (data) {
            $('#comments').html(data);
        }
    });
});