我有一个表作为下面的数据表:
<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个值，我想添加到每列(而不是counter1, counter2等…)，如下所示:
<?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响应作为数据附加到表的不同单元格中呢?
marko当您从调用中获得数据时，您必须使用.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.
}
}