Search the Community

I am pulling stock symbols from Yahoo finance in a json object and I am trying to show them as a drop-down menu while the user starts typing the name of the company or the symbol in the search box . Typeahead is not working as a drop down menu from the search box. I think I am doing everything right.This is the code I have so far. Any help is appreciated. quote.js $(document).ready(function() { // create autocomplete $('#form-quote input[name=symbol]').typeahead({ // load autocomplete data from suggest.php source: function(query, callback) { $.ajax({ url: '../suggest.php', type: 'POST', dataType: 'json', data: { symbol: query }, success: function(response) { callback(response.symbols); } }); } }); // load data via ajax when form is submitted $('#form-quote').on('click', function() { // determine symbol var symbol = $('#form-quote input[name=symbol]').val(); // send request to quote.php $.ajax({ url: 'quote.php', type: 'POST', data: { symbol: symbol }, success: function(response) { $('#price').text(response); } }); return false; }); }); quote.php <?php //configuration require("../includes/config.php"); //if form was submitted if($_SERVER["REQUEST_METHOD"] == "POST"){ $stock = lookup(strtoupper($_POST["symbol"])); if(empty($_POST["symbol"])){ //echo "You must enter a stock symbol"; }else if($_POST["symbol"]){ $price = number_format($stock['price'], 2); echo "A share of {$stock['name']} costs $$price"; } } else{ // render portfolio render("stock_search.php", ["title" => "Get Quote"]); } ?> quote_search.php <form id = "form-quote" action="quote.php" method="post"> <fieldset> <div class="control-group"> <input name="symbol" autofocus autocomplete="off" placeholder="Symbol" type="text"/> </div> <div class="control-group"> <button type="submit" class="btn">Get Quote</button> </div> </fieldset> <div id="price"></div> <div id="suggestions"></div> </form> <script type="text/javascript" src="js/quote.js" ></script> quote_search.php <form id = "form-quote" action="quote.php" method="post"> <fieldset> <div class="control-group"> <input name="symbol" autofocus autocomplete="off" placeholder="Symbol" type="text"/> </div> <div class="control-group"> <button type="submit" class="btn">Get Quote</button> </div> </fieldset> <div id="price"></div> <div id="suggestions"></div> </form> <script type="text/javascript" src="js/quote.js" ></script> suggest.php <?php // configuration require("../includes/functions.php"); // if form was submitted if ($_SERVER["REQUEST_METHOD"] == "POST") { // load suggestion data $data = @file_get_contents("http://d.yimg.com/aq/autoc?query= {$_POST['symbol']}&region=US&lang=en-US&callback=YAHOO.util.ScriptNodeDataSource.callbacks"); // parse yahoo data into a list of symbols $result = []; $json = json_decode(substr($data, strlen('YAHOO.util.ScriptNodeDataSource.callbacks('), -1)); foreach ($json->ResultSet->Result as $stock) $result[] = $stock; echo json_encode(['symbols' => $result]); } ?>