javascript - Utilising the same ajax data for a "refresh all" event (wanting to prevent multiple calls) -


so have page multiple containers dynamically added , filled html, of populated data pulled via ajax json file. every 5 minutes page runs function gets every container (marked class) , each of them works out id/index (probably not efficiently) , ajax post.etc.

but ajax call resulting data same every instance (no limit on average there ~30 ajax calls of same data 1 whole page), grabs it, decodes it, sorts it, updates html , really.

this feels clunky , im sure cause issues down line, there can prevent these 30+ ajax posts without disabling being 'asynchronous'/lessen impact of it?

setinterval(function() {     $('.fill').each(function() {         var selectid = this.id;         var selectidnum = selectid.replace(/\d/g, '');         selectedid = 'selectedcoin' + selectidnum;         var index = document.getelementbyid(selectedid).selectedindex;         $.ajax({             url: 'array-to-json.php',             type: 'post',             datatype: 'json',             success: function(data) {                 data.sort(function(a, b) {                     return (a.id > b.id) ? 1 : ((b.id > a.id) ? -1 : 0);                 });                 result = data;                 var php1 = [result[index].name, result[index].symbol, result[index].price_btc, result[index].percent_change_24h, result[index].price_usd, result[index].id, result[index]['24h_volume_usd']];                 var mycoincost = parsefloat($('#buyprice' + selectidnum).val());                 var myperccoin = (parsefloat(php1[2]).toprecision(20) - mycoincost) / mycoincost * 100;                 var mycointotal = parsefloat($('#coins' + selectidnum).val());                 var myusdcoin = mycointotal * parsefloat(php1[4]).toprecision(20);                 $("#price" + selectidnum).html(php1[2]);                 $("#pricepercent" + selectidnum).html(php1[3]);                 $("#priceusd" + selectidnum).html(php1[4] + "</span>");                 $("#volday" + selectidnum).html("$" + php1[6] + "</span>");                 $("#mypercent" + selectidnum).html(myperccoin.tofixed(2) + "%");                 $("#myearnings" + selectidnum).html(myusdcoin.tofixed(2));             },             error: function() {                 alert("error");             }         });     }); }, 300 * 1000); 

it seems call returns data containers already. don't pass specific id it, , filtering results when them, make assumption.

in case, need move .each loop inside ajax success function. way ajax runs once, , loop through data when it's received apply html.

i think should it:

setinterval(function() {     $.ajax({         url: 'array-to-json.php',         type: 'post',         datatype: 'json',         success: function(data) {             data.sort(function(a, b) {                 return (a.id > b.id) ? 1 : ((b.id > a.id) ? -1 : 0);             }); //is necessary? server-side sort more efficiently, esp if it's result of sql query.             result = data;             $('.fill').each(function() {                 var selectid = this.id;                 var selectidnum = selectid.replace(/\d/g, '');                 selectedid = 'selectedcoin' + selectidnum;                 var index = document.getelementbyid(selectedid).selectedindex;                 var php1 = [                   result[index].name, result[index].symbol,                    result[index].price_btc, result[index].percent_change_24h,                    result[index].price_usd, result[index].id,                    result[index]['24h_volume_usd']                 ];                 var mycoincost = parsefloat($('#buyprice' + selectidnum).val());                 var myperccoin = (parsefloat(php1[2]).toprecision(20) - mycoincost) / mycoincost * 100;                 var mycointotal = parsefloat($('#coins' + selectidnum).val());                 var myusdcoin = mycointotal * parsefloat(php1[4]).toprecision(20);                 $("#price" + selectidnum).html(php1[2]);                 $("#pricepercent" + selectidnum).html(php1[3]);                 $("#priceusd" + selectidnum).html(php1[4] + "</span>");                 $("#volday" + selectidnum).html("$" + php1[6] + "</span>");                 $("#mypercent" + selectidnum).html(myperccoin.tofixed(2) + "%");                 $("#myearnings" + selectidnum).html(myusdcoin.tofixed(2));             });         },         error: function(jqxhr) {             alert("error while fetching data");             console.log("error while fetching data: " + jqxhr.status + " " + jqxhr.statustext + " " + jqxhr.responsetext); //improved error logging         }     }); }, 300 * 1000); 

Comments

Popular posts from this blog

javascript - Replicate keyboard event with html button -

node.js - Node js - Trying to send POST request, but it is not loading javascript content -

javascript - Web audio api 5.1 surround example not working in firefox -