I am newbie in Typeahead. Now I need to change typeahead from static way to ajax way. The code is like,
var countries2 = [{ labelPost: "AUSTRALIAN NATIONAL UNIVERSITY ACT 200", valuePost: 200 },
{ labelPost: "DARWIN NT 800", valuePost: 800 }, { labelPost: "DARWIN NT 801", valuePost: 801 }, { labelPost: "WAGAIT BEACH NT 803", valuePost: 803 },
{ labelPost: "PARAP NT 804", valuePost: 804 }, { labelPost: "ALAWA NT 810", valuePost: 810 }, { labelPost: "BRINKIN NT 810", valuePost: 810 }, { labelPost: "CASUARINA NT 810", valuePost: 810 }];
$('#txtPostcode').typeahead({
name: 'Postcode',
displayText: function (item) { return item.labelPost; },
items: 10,
source: countries2,
updater: function (item) {
$('#txtPost').val(item.valuePost);
return item.labelPost;
}
});
Then I output the array to a json file "city.json" and put it under the project folder where I can visit by openning localhost/city.json, then I tried the code like.
$('#txtPostcode').typeahead({
name: 'Postcode',
displayText: function (item) { return item.city; },
items: 10,
source: function (query, process) {
var parameter = { query: query };
$.get('city.json', parameter, function (data) {
process(data);
});
It doesn't work, and did not throw any errors.
And then I tried this way.
$('#txtPostcode').typeahead({
name: 'Postcode',
displayText: function (item) { return item.labelPost; },
items: 10,
source: {
ajax: {
url: "/city.json",
}
},
updater: function (item) {
$('#txtPost').val(item.valuePost);
return item.labelPost;
}
});
But same result.
Could somebody help me with this?
</div>