google finance - Getting jquery data to populate table column -


i trying javascript stock ticker work, going knowledge of javascript @ beginner level.

the current code (top example) pulls out live stock data using google finance api. checks see stock acronym , prints full company name , has various styling.

the second part attempt data displaying in table format, columns work cant jquery populate final column live date :(.

i need create 3 columns; 1 stock name eg (haulotte), 1 stock acroynm eg (pig) , 1 live stock figures. ensure each stock data row keeps parallel 1 above , below it.

attached current jsfiddle:

thanks help.

https://jsfiddle.net/oqousalw/

<div class="haul" data-symbol="pig" data-title="haulotte"></div> <div class="ashtead" data-symbol="aht" data-title="ashtead"></div> <div class="united" data-symbol="uri" data-title="united rentals"></div> <div class="terex" data-symbol="tex" data-title="terex"></div> <div class="cat" data-symbol="cat" data-title="caterpiller"></div> <div class="hees" data-symbol="hees" data-title="h&e equipment"></div> <div class="pal" data-symbol="pal" data-title="palfinger "></div> <br>     <br>         <b>replicate above code in table format. cant live data appear</b>         <br>             <br>          <div class="box"> <div class="floatleft2 " style="padding:5px;">     <div>haulotte</div>     <div>ashtead</div>     <div>united rentals</div>     <div>terex</div> </div> <div class="stocksymbolnew" style="padding:5px;">       <div><b>pig</b></div>       <div><b>aht</b></div>       <div><b>uri</b></div>       <div><b>tex</b></div> </div> <div class="floatleft2" style="padding:5px;">     <div><i>get live data</i></div>       <div><i>get live data</i></div>       <div><i>get live data</i></div>       <div><i>get live data</i></div> </div> </div> 

i have updated jsfiddle make work expected.

all did dynamically populate values in divs below.

provided ids divs can append values.

<div id="title" class="floatleft2 " style="padding:5px;">  </div> <div id="symbols" class="stocksymbolnew" style="padding:5px;">  </div> <div id="livedata" class="floatleft2" style="padding:5px;">  </div> 

appended values using jquery below.

$("#title").append("<div>" + divcontainer.data('title') + "</div>"); $("#symbols").append("<div><b>" + stockinfo1.t + "</b></div>"); $("#livedata").append("<div>" + stockchange + "</div>"); 

note: order of items vary between requests because calls google finance asynchronous

update

i have updated answer based on comment.

please find updated jsfiddle here. have order of records fixed, should have elements in place , identifier set values elements. in order this, provide ids div display live data below.

<div class="floatleft2" style="padding:5px;">       <div><i id="livedatapig"></i></div>       <div><i id="livedataaht"></i></div>       <div><i id="livedatauri"></i></div>       <div><i id="livedatatex"></i></div>       <div><i id="livedatacat"></i></div>       <div><i id="livedatahees"></i></div>       <div><i id="livedatapal"></i></div> </div> 

and update js supply values this.

$("#livedata" + stockinfo1.t).html(stockprice + stockchange); 

if familiar on how jquery selectors work, should pretty straight forward understand.

if not, please refer https://api.jquery.com/category/selectors/basic-css-selectors/. give basic idea. other selectors can found @ https://api.jquery.com/category/selectors/.


Comments

Popular posts from this blog

angularjs - ADAL JS Angular- WebAPI add a new role claim to the token -

php - CakePHP HttpSockets send array of paramms -

node.js - Using Node without global install -