追加Jquery的Ajax「的數據」作爲表中獨立的值

Question

我有一個表如下面的數據表表：

  <button id="addRow">Add New Row</button><br> 
       <table class="table table-striped table-bordered table-hover " id="example" cellSpacing=0 width="100%"> 
        <thead> 
         <tr> 
          <th>1</th> 
          <th>2</th> 
          <th>3</th> 
          <th>4</th> 
          <th>5</th> 
         </tr> 
        </thead> 
        <tr style="text-align: center;"> 
         <td>hola</td> 
         <td>ciao</td> 
         <td>bonjour</td> 
         <td>yo</td> 
         <td>salut</td> 
        </tr> 
       </table> 

我想使用JavaScript腳本追加元素如下所示：

<script type="text/javascript"> 
         $(document).ready(function() { 
          debugger; 
          var t = $('#example').DataTable({ "searching": true, "paging": true }); 
         var counter = 1; 
         $('#addRow').on('click', function ciicici() { 

         var now = new Date(); 
         var now = now.toMysqlFormat(); 
         var tii = new Date(); 
         tii.setSeconds(tii.getSeconds() - 50000); 
         var tii = tii.toMysqlFormat(); 
         $.post("sqlmachine_test_ajax.php", { timing: now,seconding: tii }) 
         .done(function(data) { 
           t.row.add([ 
           counter +'.1', 
           counter +'.2', 
           counter +'.3', 
           counter +'.4', 
           counter +'.5' 
           ]).draw(); 
           counter++; 
          // }); 
          //setTimeout(function(){ciicici();}, 5000); 
         }); // Automatically add a first row of data 
         $('#addRow').click(); 
        }); 
       </script> 

這兩個工作正常，唯一的薄弱之處是我想要通過Jquery AJAX腳本來追加元素。

比方說，我有一個PHP頁面發回的5個值我想補充到每一列（而不是C1的，C2的等等），如下所示：

<?php 
echo 'counter1, counter2, counter3, counter4, counter5'; 
?> 

，並在JavaScript的我想簡單地說：

... 
.done(function(data) { 
            t.row.add([ 
            data //(instead of the counters) 
            ]).draw(); 
            counter++; 
... 

我曾經嘗試這樣做，以及數組和JSON編碼的數組，但我得到的是5個結果表中的相同第一個單元格。 那麼我怎樣才能將ajax php響應追加到表中作爲表中不同單元格的數據呢？

馬爾科

Answer 1

當你得到你的數據從回電，你必須使用.split()分離。

所以，當你可以做到這一點回調

.done(function(data) { 
    var splitData = data.split(", ") //Split your data with the comma and space 
    $.each(splitData, function(e){ //For each piece of data 
     //Add your rows here one by one 
     t.row.add([ 
      splitData[e] //Make sure the 'e' in the function and here are the same 
     ]).draw(); 
    }) 
    counter++; 
}); 

這是一個鬆散的答案，我會嘗試更很快補充。

編輯：更多信息

我通常做的是回聲一切有隔板。所以，在你的情況下，我會回顯1, 2, 3, 4, 5:A, B, C, D, E。所以當數據返回時，這就是你會看到的。

在你的數據成功，你會做這樣的事情

var dataParts = data.split(":") //This splits your data into the 2 parts using the : separator 
var dataPart1 = dataParts[0] //This will get 1, 2, 3, 4, 5 
var dataPart2 = dataParts[1] //this will get A, B, C, D, E 

從那裏

然後，你分裂使用逗號。

var dataPieces1 = dataPart1.split(', '); 
var dataPieces2 = dataPart2.split(', '); 

然後運行循環。 （使用JavaScript的for循環通常比使用更好的jQuery的.each()）

for(var i = 0; i < dataPieces1.length; i++){ //Start your for loop on the first part 
    //Create a row here using dataPieces1[i], this will loop and make a new 
    //row every time the next loop finishes 
    for(var j = 0; j < dataPieces2.length; j++){ //Start the second loop 
     //Not sure how you would want to do this, but here's some example code 
     //Since you're inside a row now, append your dataPieces2[j] to that row 
     //This will loop for every dataPieces2 and append each one as a column 
     //in that single row. 
    } 
}