-
-
Save jharding/9458744 to your computer and use it in GitHub Desktop.
<div id="the-basics"> | |
<input class="typeahead" type="text" placeholder="States of USA"> | |
</div> |
var substringMatcher = function(strs) { | |
return function findMatches(q, cb) { | |
var matches, substringRegex; | |
// an array that will be populated with substring matches | |
matches = []; | |
// regex used to determine if a string contains the substring `q` | |
substrRegex = new RegExp(q, 'i'); | |
// iterate through the pool of strings and for any string that | |
// contains the substring `q`, add it to the `matches` array | |
$.each(strs, function(i, str) { | |
if (substrRegex.test(str)) { | |
matches.push(str); | |
} | |
}); | |
cb(matches); | |
}; | |
}; | |
var states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', | |
'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii', | |
'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana', | |
'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota', | |
'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire', | |
'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota', | |
'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island', | |
'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', | |
'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming' | |
]; | |
$('#the-basics .typeahead').typeahead({ | |
hint: true, | |
highlight: true, | |
minLength: 1 | |
}, | |
{ | |
name: 'states', | |
source: substringMatcher(states) | |
}); |
@jharding this is the updated working version, could you change yours to this?
https://gist.github.com/skycocker/382c76f696c50a165585
+1
I could only get this working after I added the handlebars script to the-basics.html page (after I did ViewSource on the examples page).
Is that correct, it doesn't seem the right way to me?
Hi all,
Example still contains some mistake with substrRegex
variable.
var substringMatcher = function (strs) {
return function findMatches(q, cb) {
// regex used to determine if a string contains the substring `q`
var substringRegex = new RegExp(q, 'i');
// an array that will be populated with substring matches
var matches = [];
// iterate through the pool of strings and for any string that
// contains the substring `q`, add it to the `matches` array
$.each(strs, function (i, str) {
if (substringRegex.test(str)) {
matches.push(str);
}
});
cb(matches);
};
};
In this function:
- fixed usage of
substringRegex
variable; - declaring variables moved exactly before usage.
Hi,
This example currently displays the result as "Undefined", as the value being pushed is a string, but it seems an object is expected in the format of [{value: "string1"}, {value: "string2"}, {value: "string3"}] according to this post on Stack Overflow. I have amended this in my fork, by changing the following on line 15 of the-basics.js:
matches.push(str);
to
matches.push({value: str});
Please feel free to merge this @jharding.
Thank you phily245! This small change resolve issue with "undefined" suggestions.
It's little strange that author publish as a first example code which not works... ;)
Hi,
It shows only 5 matches instead of all matched string. How to show all matches?