将html附加到dataTable

Question

I have an ajax function whose response is in the form of html and has the following contents.

<tr><td>data1</td>td>data1</td>td>data3</td></tr>

Is it possible to add the response to dataTable row like this

$.ajax({
                type:"POST",
                url:myurl,
                data:myformdata,
                cache: false,
                contentType: false,
                processData: false,
                success:function(hasil){  
                    if($.parseHTML(hasil))
                    { 
                        if($(hasil).filter('table').length)
                        {
                          $('#lstNews').DataTable().row.
add($(hasil).filter('table').html()).draw();
                        }

                    }
         });

In the google I have found that I need to make the response to the following format for adding it to dataTable

$('#lstNews').DataTable().row.add(
   [[ "data1", "data2","data3" ]
     ]
).draw();

Please help me

Answer 1

You can use jQuery's parseHTML function on the response, and use maping to fetch the html/data from each of the td's into an array.

EDIT: Removed arrow function for non ES6 support.

var str = '<tr><td>data1</td><td>data1</td><td>data3</td></tr>';

var html = $.parseHTML(str);

console.log($('td', html).map(function(_, el) {
  return $(el).html()
}));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

</div>