I am facing an issue in displaying the JSON Store data that is pushed to the database. Here is my code snippet for displaying the json store documents that are pushed to the server.
var _showTable = function (arr) {
if (_.isArray(arr) && arr.length < 1) {
return _logMessage(EMPTY_TABLE_MSG);
}
//Log to the console
WL.Logger.ctx({stringify: true, pretty: true}).info(arr);
var
//Get reference to the status field
status = $('div#status-field'),
//Table HTML template
table = ['<table id="bu_table" >',
'<tr>',
'<td><b>JSON ID</b></td>',
'<td><b>BU NAME</b></td>',
'<td><b>BU DESC</b></td>',
'</tr>',
'<% _.each(bu, function(results) { %>',
'<tr>',
'<td> <%= results._id %> </td>',
'<td> <%= results.json.buname %> </td>',
'<td> <%= results.json.budesc %> </td>',
'</tr>',
'<% }); %>',
'</table>'
].join(''),
//Populate the HTML template with content
html = _.template(table, {bu : arr});
//Put the generated HTML table into the DOM
status.html(html);
};
I am trying to display the documents from the database by clicking a button. Every time I click the button, entire documents are getting appended in the table instead of replacing. How can I replace the documents instead of repeating every time I click the button?
Clear the table before you append new data.
$('div#status-field').empty();