I am new to jquery, I am trying to display dynamic table with jquery. But when I call below
jQuery.each(data, function(index, value) {
value_split = value.slice(',');
for(var i=0;i<value_split.length;i++){
$("#table").append("<tr><td>" + value_split[i] + "</td></tr>");
}
});
I am splitting because it's comma separated list. I get data like
First name
Last Name
Age
Sam
Don
23
How can I get in proper format with 3 headers and details in below row like normal table
yes I'm slicing becuase data is object e.g. Object {headers: Array[6], values: Array[6]}
sorry it's object not list
You probably wanted to create the row outside the inner loop, otherwise you'll get a new row for each value you append.
var data = [
"Sam, Don, 23",
"Jane, Doe, 40"
];
jQuery.each(data, function(index, value) {
var value_split = value.split(',');
var tr = $('<tr />');
for(var i=0;i<value_split.length;i++){
tr.append( $('<td />', {text : value_split[i]}) );
}
$("#table").append(tr);
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table">
<tr><th>First Name</th><th>Last Name</th><th>Age</th></tr>
</table>