Append html to 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

Blue · Accepted Answer · 2018-01-15 18:32:27Z

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>

edited Jan 15, 2018 at 18:32

answered Jan 15, 2018 at 18:24

Blue

23k7 gold badges69 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Techy Over a year ago

When I am copying the code,its giving me some error in the => section .Also if my response is having multiple rows ,can I use the same code for parsing???

Blue Over a year ago

@Techy Feel free to do a little research on your own to loop through the TR's, and add them each to the DataTable.

Collectives™ on Stack Overflow

Append html to dataTable

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related