fnAddData() in datatable adds to same row instead of adding to new rows



I've a xml String which I need to display in datatable based on that xml data..



var xml = "<Users><user><username>user</username><password>password</password></user><user><username>user1</username><password>password1</password></user><user><username>user2</username><password>password2</password></user></users>"; //this is a sample, but in reality I'm getting the xml string from server
xmlDoc = $.parseXML(xml); //parsing xml to valid xml document
var $events = $(xmlDoc).find("Users");

var thisTable;
thisTable = $("#user-data").dataTable( //user-data is the id of my table
{
"sPaginationType": "full_numbers",
"bJQueryUI": true
}
);

$events.each(function(index, event){
console.log('test');
var $event = $(event),
addData = [];
addData.push( $event.children("loan").children("user").children("username").text());
addData.push($event.children("user").children("password").text());
thisTable.fnAddData(addData);
});


This was based on the demo present here


http://ift.tt/1zhZWcR


But I'm having a very strange issue, in my console, "test" gets printed only one time, so the each is iterating just only one time. Also in my table, all the usernames are displayed in first row's username field and all the passwords are displayed in first row's password field. To say, the data I'm using in relatime time is entirely different and this is just an example for that. This is the table



<table class="table table-striped table-bordered table-hover" id="loan-data">
<thead>
<tr>
<th>Username</th>
<th>Password</th>
</tr>
</thead>
<tbody>
</tbody>
</table>


I cant figure out why does all the datas are added to a single row which is mainly due to the fact that .each is iterated just only one no matter how much list of datas are present. It works perfectly in the fiddle example, but when I try it with some modification, I'm getting this conflict..


No comments:

Post a Comment