Adding multiple rows with ajax problem

itajackass

I've a strange problem adding more than one row with ajax.

This is my button to add row retrieved from ajax (see dataType: text):

   $("body").on("click","#btn-add", function(e) {

    e.preventDefault();

    var table= $('#table').DataTable();

    $.ajax({
        type: "POST",
        async: false,
        dataType:"text",
        url: "ajax/get-rows.php",
        data: { },
        success: function(data) {

            table.rows.add($(data)).draw( false );

        }
    });

   });

This is my get-rows.php

<?php
  //START
?>
  <tr>
    <td>COL 1</td>
    <td>COL 2</td>
    <td>COL 3</td>
  </tr>
  <tr>
   <td>COL 1</td>
   <td>COL 2</td>
   <td>COL 3</td>
 </tr>
<?php //END ?>

I always get this error:
table id=table- Requested unknown parameter '0' for row 1, column 0

But if I modify get-rows.php to only ONE row it works!

 <?php
 //START
 ?>
 <tr>
    <td>COL 1</td>
    <td>COL 2</td>
    <td>COL 3</td>
 </tr>
 <?php //END ?>

What's the problem?

rajmalviya

<?php
$data[] = array("COL 1"," COL 2","Col 3");
echo json_encode($data);

<?php > ?>

var dataSet = JSON.parse(data);
table.rows.add($(dataSet)).draw();

may it will help.