試圖添加Ajax請求到數據表

Question

我試圖添加一些功能到我的表，將允許用戶選擇一個或多個行，以便用戶單擊刪除按鈕後，它會發送一個Ajax請求到服務器它將在哪裏刪除表格中的項目。我一直在查看datatables網站，這是我添加到我的頁面的腳本，並且有很多我不確定完成此操作需要什麼。

$('#table').dataTable({ 
    "sDom": '<"top"lTf<"clear">>rt<"actions"<"actions-left"i><"actions-right"p>>', 
    "bAutoWidth": false, 
    "sPaginationType" : "full_numbers", 
    "oTableTools": { 
    "aButtons": [ 
      { 
       "sExtends": "text", 
       "sButtonText": "Add" 
      }, 
      { 
       "sExtends": "text", 
       "sButtonText": "Edit" 
      }, 
      { 
       "sExtends": "text", 
       "sButtonText": "Delete", 
       "sAjaxUrl": "delete_title" 
      }, 
     ] 
    }, 
    "aoColumnDefs": [ 
     { "bSortable": false, "aTargets": [ 0 ] }, 
     { "sWidth": "20px", "aTargets": [ 0 ] }, 
     { "sWidth": "40px", "aTargets": [ 1 ] }, 
     { "sClass": "alignCenter", "aTargets": [ 1 ] } 
    ] 
}); 

<?php    
     $tmpl = array ('table_open' => '<table class="table" id="titles-table">'); 
     $data = array('name' => 'titles', 'class' => 'selectall'); 
     $this->table->set_heading(form_checkbox($data), 'ID', 'Title Name', 'Style', 'Status');    
     $this->table->set_template($tmpl);    
     foreach ($titles as $row) 
     { 
      $checkbox_data = array(
       'name'  => 'titles', 
       'id'   => $row->id 
      ); 
      $this->table->add_row(form_checkbox($checkbox_data), $row->id, $row->title_name, $row->type_name, $row->status_name); 
     } 
     echo $this->table->generate(); 
     ?> 

是否anyoen別人看到我「米失蹤？

Answer 1

Alternaitve路由只是簡單地使用jquery/javascript來做你的出價..這是我做的一個非常相似的例子，它不是你的原因的直接答案..但如果改變以匹配你的id的類等。可以做很多可以幫助你在你的事業

 $("#hideme").click(function(e) 
     { 
      e.preventDefault(); 
      var postArray = new Array(); 
      i=0; 
      $("input:checked").each(function() 
      { 
       var theID = $(this).attr("name"); 
       theID = theID.replace("offerterms-", ""); 
       postArray.push(theID); 
       $(this).parents("tr").animate(
        {"color":"#FFF", "background-color":"#FFF"}, 
        "5000", 
        function() 
        { 
         $("input:checked").parents("tr").remove(); 
         $("table.datatable TR").removeClass("darkrow"); 
         $("table.datatable TR:odd").addClass("darkrow"); 
        }); 
      }); 
      $.post("./hide/", {"entry":postArray}, function(data) 
      { 
       if((".datatable tr").length == 1){$(".datatable").hide();$("#hideme").hide();$("#recordCount").text("0");} 
       else{$("#recordCount").text((parseInt($("#recordCount").text())-1));} 
       //alert(data.msg); 
      }, "json"); 
     }); 

這是什麼一樣，基本上在桌子上迭代，並構建選中的複選框的數組張貼到我的後端在此期間我使用數組處理我的數據庫條目和在我的情況下預製形式隱藏的數據，所以它隱藏在另一個類似的表上使用，哪些管理員可以查看這些並稍後取消隱藏它們。無論如何，當迭代在表上，然後隱藏在每行的基礎上所有t他用複選框行檢查。

Answer 2

檢查例子爲Server Side Processing。

您需要的sAjaxSource添加到您的DataTable的初始化，並在那裏定義刪除。還您可能需要額外的推服務器PARAMS到服務器端，您可以使用這樣的事情：如果你需要更多的幫助或更多的細節強制

//Example from one of my projects: 
//This adds extra data to the ajax request sent by datatables. 
"fnServerParams": function (aoData) { 
     aoData.push({ "name": "bu", "value": BU }); 
     aoData.push({ "name": "SLAName", "value": SLANAME }); 
     aoData.push({ "name": "substep", "value": STEP }); 
     aoData.push({ "name": "timeperiod", "value": TIME }); 
     var UserFilter = $("#userFilter").val(); 
     aoData.push({ "name": "user", "value": UserFilter }); 
    } 

不問！

// EDIT 1

$('#table').dataTable({ 
"sDom": '<"top"lTf<"clear">>rt<"actions"<"actions-left"i><"actions-right"p>>', 
"bAutoWidth": false, 
"sPaginationType" : "full_numbers", 
"sAjaxSource" : "/path/to/function", 
"fnServerParams": function (aoData) { 
    aoData.Push(ArrayWithCheckboxInfo); 
}, 
"oTableTools": { 
"aButtons": [ 
     { 
      "sExtends": "text", 
      "sButtonText": "Add" 
     }, 
     { 
      "sExtends": "text", 
      "sButtonText": "Edit" 
     }, 
     { 
      "sExtends": "text", 
      "sButtonText": "Delete", 
      "sAjaxUrl": "delete_title" 
     }, 
    ] 
}, 
"aoColumnDefs": [ 
    { "bSortable": false, "aTargets": [ 0 ] }, 
    { "sWidth": "20px", "aTargets": [ 0 ] }, 
    { "sWidth": "40px", "aTargets": [ 1 ] }, 
    { "sClass": "alignCenter", "aTargets": [ 1 ] } 
] 

}）;

然後在服務器端處理基於數組中信息的複選框。我不知道是否要從數據表或數據庫中刪除行，但可以同時執行這兩行，然後它會將更新的數據發送到客戶端。