Retrieving stock updates using Yahoo Finance
Basically what i am trying do is retrieving stock quotes for specific company . In my code I am giving symbol of specific company(eg:FB) in a textbox(symb) and when i click the button(getupdate) it should list out details regarding that specific stock which i enter the text box .
Here's my code :
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
$(document).ready(function($){
$('getupdate').click(function() {
var symbol = $('input[id=symb]').val(); \\For Example:FB
var url = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D'+symbol+'&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys";
$.getJSON(url, function(data) {
var items = [];
$.each(data.query.results.quote, function(key, val) {
items.push('<li id="' + key + '">' + val + '</li>');
});
$('<ul/>', { 'class': 'my-new-list', html: items.join('')}).appendTo('body');
});
});
});
</script>
</head>
<body>
<div style="padding:16px;">
Stock Ticker : <input id="symb" type="textbox" value="Ticker"></input>
</div>
<button id="getupdate" name = "getupdate" type="button">Get Updates!</button>
</body>
</html>
Where am i going wrong ?
Thanks in advance.
Answer
You have several mistakes in your JS code:
- Incorrect selector for a button:
$('getupdate')=>$('#getupdate'); - Wrong quotes inside
urlvalue; - Wrong query string to Yahoo API;
- Wrong comment sign
\\For Example:FB.
Your JS should be like this:
jQuery(document).ready(function($){
$('#getupdate').click(function() {
var symbol = $('input[id=symb]').val();
var url = 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20where%20symbol%3D%22' + symbol + '%22&format=json&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=';
$.getJSON(url, function(data) {
var items = [];
$('#results').html('');
$.each(data.query.results.quote, function(key, val) {
items.push('<li id="' + key + '">' + val + '</li>');
});
$('<ul/>', { 'class': 'my-new-list', html: items.join('')}).appendTo('#results');
});
});
});
And please add this code after <button> tag in your HTML. This will help you easily clear results before new query:
<div id="results"></div>
Here is an example: http://jsfiddle.net/6EFqk/1/
I'm not shure that ouput format is correct, please reformat it as you like.