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个值，我想添加到每个列（而不是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响应附加到表中作为表中不同单元格的数据？

马尔科

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＆＃39; s for循环通常比使用jQuery＆＃39; s .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.
    } 
}

将Jquery Ajax“data”作为表

1 个答案: