i am getting api response and appending the response in html table. now i am trying to setInterval but the setInterval is not properly set. here is the code.
const settings = {
"async": true,
"crossDomain": true,
"url": "https://datasource.com/price?list",
"method": "GET",
"headers": {
"xxxxxxxxxxxxxxxxxx",
"xxxxxxxxxxxxxxxx"
}
};
setInterval(function() {
$.ajax(settings).done(function(response) {
var sdata = '';
$.each(response, function(key, value) {
sdata += '<tr>';
sdata += '<td>' + value.symbol + '</td>';
sdata += '<td>' + value.lastPrice + '</td>';
sdata += '<td>' + value.change + '</td>';
sdata += '<td>' + value.pChange + '</td>';
sdata += '<td>' + value.open + '</td>';
sdata += '<td>' + value.dayHigh + '</td>';
sdata += '<td>' + value.dayLow + '</td>';
sdata += '<td>' + value.previousClose + '</td>';
sdata += '<td>' + value.perChange30d + '</td>';
sdata += '<td>' + value.perChange365d + '</td>';
sdata += '<td>' + value.lastUpdateTime + '</td>';
sdata += '</tr>';
});
$('#shares').html(sdata);
//console.log(response);
});
}, 5000);<table id="shares">
<tr>
<th>NAME</th>
<th>LTP</th>
<th>CHANGE</th>
<th>CHG %</th>
<th>OPEN</th>
<th>HIGH</th>
<th>LOW</th>
<th>CLOSE</th>
<th>30 DAY ROI</th>
<th>1 YR ROI</th>
<th>UPDATED ON</th>
</tr>
</table>How i can implement a working setInterval in the javascript code mentioned above ?
.append(sdata) appends data (unsurprisingly :) )
If you don't want to append, but replace the whole thing, use .html(sdata).
const settings = {
"async": true,
"crossDomain": true,
"url": "https://datasource.com/price?list",
"method": "GET",
"headers": {
"xxxxxxxxxxxxxxxxxx",
"xxxxxxxxxxxxxxxx"
}
};
setInterval(function() {
$.ajax(settings).done(function (response) {
var sdata = '';
$('#shares').empty();
$.each(response, function(key,value){
sdata += '<tr>';
sdata += '<td>'+value.symbol+'</td>';
sdata += '<td>'+value.lastPrice+'</td>';
sdata += '<td>'+value.change+'</td>';
sdata += '<td>'+value.pChange+'</td>';
sdata += '<td>'+value.open+'</td>';
sdata += '<td>'+value.dayHigh+'</td>';
sdata += '<td>'+value.dayLow+'</td>';
sdata += '<td>'+value.previousClose+'</td>';
sdata += '<td>'+value.perChange30d+'</td>';
sdata += '<td>'+value.perChange365d+'</td>';
sdata += '<td>'+value.lastUpdateTime+'</td>';
sdata += '</tr>';
});
$('#shares').html(sdata);
}); }, 5000); table {
border: 1px;
}<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<title></title>
</head>
<body>
<table>
<thead>
<tr>
<th>NAME</th>
<th>LTP</th>
<th>CHANGE</th>
<th>CHG %</th>
<th>OPEN</th>
<th>HIGH</th>
<th>LOW</th>
<th>CLOSE</th>
<th>30 DAY ROI</th>
<th>1 YR ROI</th>
<th>UPDATED ON</th>
</tr>
</thead>
<tbody id="shares">
</tbody>
</table>