Ajax удаляет всю таблицу HTML вместо обновления

Question

Я создаю проект и впервые использую Ajax. В настоящее время у меня есть таблица данных, и я использовал Ajax для добавления и удаления записей из таблицы без перезагрузки страницы. Следующим шагом, который я хочу сделать, является обновление данных в таблице, когда данные добавляются или удаляются из данных.

В моем коде Ajax, у меня есть следующие:

$(document).ready(function(){ 

$('form#TesttableIndexForm').submit(function(event){ 
    event.preventDefault(); 

    $.ajax({ 
     url:'/testing/save_ajax_data', 
     type:'POST', 
     data: $("form#TesttableIndexForm").serialize(), 
     success: function(data) { 
      $("#testtable").replaceWith(data); 
     }, 

    });  
}); 

$('a.deleteajax').click(function(event){ 
    event.preventDefault(); 

    var answer = confirm("Delete this record?") 
    if (answer){ 
     $.ajax({ 
      url:'/testing/delete_ajax_data/', 
      type:'GET', 
      data: $(this).attr("href"), 
      success: function(data) { 
       $("#testtable").replaceWith(data); 
      }, 
     }); 
    } 

    return false; 
}); 

}); 

Идентификатор таблицы является #testtable. Я добавил $("#testtable").replaceWith(data); внутри части кода success, так что когда данные будут добавлены или удалены, таблица будет обновлена.

Однако, несмотря на то, что данные могут быть удалены и добавлены с использованием этого кода Ajax, когда происходит любое событие, таблица исчезает. Когда я перезагружаю страницу вручную, таблица снова появляется с измененными данными.

Я использую CakePHP, а данные из таблицы создаются из базы данных. Это будет причиной моих проблем?

Заранее благодарен!

Answer 1

Выяснено, в чем проблема.

В моем файле Ajax я добавил var loadUrl = "/test-area/table/";, который является URL-адресом контроллера, который будет загружать таблицу HTML. Я должен был затем создать функцию в моем контроллере в основном запрос к базе данных еще раз:

function testtable() { 
    $this->layout = 'ajax'; 
    $this->loadModel('Testtable'); 

    $testing = $this->Testtable->find('all'); 
    $this->set('testing', $testing); 
} 

То, что я заметил, когда играл примерно с этого является то, что если вы не укажете $this->layout = 'ajax'; он загрузит страницу с по умолчанию раскладка. Это затем полностью разрушает страницу. Поэтому я создал совершенно пустой файл макета с именем ajax.

Затем в коде Ajax, я удалил:

$("#testtable").replaceWith(data); 

С:

$("#testtable").load(loadUrl + "#testtable"); 

С учетом всех этих вещей вместе, когда запись добавляется или удаляется, то таблица будет перезагружать без проблемы.