Show list of data in table with set time out
-
Hey guys, I know the title is simple but I'm new to javascript and would appreciate if you could help me out here's the deal, I ve got some records that i read from database, and I want to add the to top of my table this is run every 20 seconds
var interval = setInterval(function () {
loadTableData(selectedOption);
}, 20000);here's what's happening inside loadTableData function
function loadTableData(dataType) {
$.get("/JsonResultlink", null, function (result) {
var itemAdd;
$.each(result, function (i, item) {
loadRecordTimeOut = setTimeout(function () {
if (result[i].VEHICLEPLATE !== undefined) {
// build the html code
itemToAdd = generateRow(result[i], dataType);
// add to table body
$('.tto-violation-tablebody').prepend(itemToAdd);
// if rows exceed 50 remove from bottom
checkRowCount();
}
}, 1000 * i);
});
clearTimeout(loadRecordTimeOut);
});
}loadTableData is called in document ready and then every 2 seconds Now I got 3 buttons that when each is clicked i call loadTableData with new dataType and show the result now the problem is that in the middle of data being added to table i click one button I want the table to clear and the new data be displayed but what i get is that data loading becomes faster and i get both data from previous load and this load, Please help me out and I'd like to learn clean coding so if you have any suggestions please let me know, appreciate it.
-
Hey guys, I know the title is simple but I'm new to javascript and would appreciate if you could help me out here's the deal, I ve got some records that i read from database, and I want to add the to top of my table this is run every 20 seconds
var interval = setInterval(function () {
loadTableData(selectedOption);
}, 20000);here's what's happening inside loadTableData function
function loadTableData(dataType) {
$.get("/JsonResultlink", null, function (result) {
var itemAdd;
$.each(result, function (i, item) {
loadRecordTimeOut = setTimeout(function () {
if (result[i].VEHICLEPLATE !== undefined) {
// build the html code
itemToAdd = generateRow(result[i], dataType);
// add to table body
$('.tto-violation-tablebody').prepend(itemToAdd);
// if rows exceed 50 remove from bottom
checkRowCount();
}
}, 1000 * i);
});
clearTimeout(loadRecordTimeOut);
});
}loadTableData is called in document ready and then every 2 seconds Now I got 3 buttons that when each is clicked i call loadTableData with new dataType and show the result now the problem is that in the middle of data being added to table i click one button I want the table to clear and the new data be displayed but what i get is that data loading becomes faster and i get both data from previous load and this load, Please help me out and I'd like to learn clean coding so if you have any suggestions please let me know, appreciate it.