多個服務器端的數據表

Question

我有一個有3個表，使用數據表，問題是數據表不能處理超過1個表，我已經在搜索的解決方案，我所得到的是使用自定義的SSP數據表頁：​​

但是，我想問的是，如果有更簡單的方法從這個問題？

- 這是網頁切片時表示基於按鈕

<div class="panel-body"> 
<div class ="row"> 
    <div class ="text-center alert col-md-12"> 
     <a class="btn btn-primary" href="#table_assall" data-toggle="tab">All Assets List</a> 
     <a class="btn btn-primary" href="#table_asborrow" data-toggle="tab">Used Assets</a> 
     <a class="btn btn-primary" href="#table_asbroken" data-toggle="tab">Damaged Assets</a> 
    </div> 
</div> 
<div class="tab-content"> 
    <div id="table_assall" class="tab-pane fade active in"> 
     <div class="table-responsive"> 
     <table class="display" width="100%" cellspacing="0" id=""> 
      *thead source code* 
     </table> 
     </div> 
    </div> 
    <div id="table_asborrow" class="tab-pane fade"> 
     <div class="table-responsive"> 
     <table class="display" width="100%" cellspacing="0" id=""> 
      *thead source code* 
     </table> 
     </div> 
    </div> 
    <div id="table_asbroken" class="tab-pane fade"> 
     <div class="table-responsive"> 
     <table class="display" width="100%" cellspacing="0" id=""> 
      *thead source code* 
     </table> 
     </div> 
    </div> 
</div> 

- 這3切換服務器端表是JS文件觸發節目表查詢

$(document).ready(function(){ 
     $('table.display').DataTable({ 
      lengthChange: true, 
      info: false, 
      fixedHeader: true, 
      select: true, 
      "bAutoWidth": false, 
      "bProcessing": true, 
      "serverSide": true,   
      "ajax":{ 
       url :"tableresponses.php", // json datasource 
       type: "post", // type of method , by default would be get 
        error: function(){ // error handling code 
        $("#astab_processing").css("display","none"); 
        } 
      } 
     }); 
}); 

所以是更多鈔票來基於按鈕點擊更改ajax網址？

Answer 1

要改變url根據您的按鈕click，我的建議是使用全局變量，寫click event您button和改變全球變量的值。

防爆

<div class ="text-center alert col-md-12"> 
     <a class="btn btn-primary changeTable" data-ajax="tableresponses.php" href="#table_assall" data-toggle="tab">All Assets List</a> 
     <a class="btn btn-primary changeTable" data-ajax="tableresponses1.php" href="#table_asborrow" data-toggle="tab">Used Assets</a> 
     <a class="btn btn-primary changeTable" data-ajax="tableresponses2.php" href="#table_asbroken" data-toggle="tab">Damaged Assets</a> 
</div> 

注意，一個額外的類名爲changeTable和額外html5屬性，data-ajax已添加到您的按鈕。

現在聲明一個全局變量併爲您的按鈕編寫click event。現在

var _ajaxURL="";//you can initialize this global variable with some default value. 

$('.changeTable').on('click',function(){ 
    _ajaxURL=$(this).attr('data-ajax'); 
}); 

的dataTable的ajax部分看起來像

"ajax":{ 
    url :_ajaxURL, // json datasource 
    type: "post", // type of method , by default would be get 
    error: function(){ // error handling code 
     $("#astab_processing").css("display","none"); 
    } 
} 

讓我知道，如果你面對這個任何問題。