/    Sign up×
Community /Pin to ProfileBookmark

Bootstrap typeahead not working

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

[code=php]$(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;
});

});[/code]

quote.php

[CODE]<?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”]);
}
?>[/CODE]

quote_search.php

[CODE]<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>[/CODE]

suggest.php

[CODE]<?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]);
}

?>[/CODE]

to post a comment
PHP

0Be the first to comment 😎

×

Success!

Help @tironci spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...