Ajax刪除整個HTML表格而不是刷新它

我正在構建一個項目，並首次使用Ajax。目前，我有一個數據表，我用Ajax添加和刪除表中的記錄，而無需重新加載頁面。我想要做的下一步是在數據添加或從數據中刪除數據時刷新表中的數據。Ajax刪除整個HTML表格而不是刷新它

在我的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; 
}); 

});

表的ID是#testtable。我在success部分代碼中添加了$("#testtable").replaceWith(data);，這樣當添加或刪除數據時，表格就會刷新。

但是，即使仍然可以使用該Ajax代碼刪除和添加數據，但是當發生任何事件時表都會消失。當我手動重新加載頁面時，表格會重新顯示修改後的數據。

我正在使用CakePHP，並且表中的數據是從數據庫生成的。這會造成我的問題嗎？

在此先感謝！

來源

2012-04-13 mickburkejnr

你從'/ testing/save_ajax_data'得到了什麼迴應，通過在'$（「＃testtable」），replaceWith（data）;'語句上面放置'alert（data）'來檢查它。 – 2012-04-13 09:34:42

找出問題所在。

在我的Ajax文件中，我添加了var loadUrl = "/test-area/table/";這是一個將加載HTML表的控制器的URL。我不得不那麼我的控制器中創建一個函數來基本上再次查詢數據庫：

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");

所有這些東西放在一起，當記錄被添加或刪除，該表將重新裝入無問題。

來源

2012-04-13 09:40:56 mickburkejnr

Ajax刪除整個HTML表格而不是刷新它

回答

相關問題