JSON Search POC
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<input type="text" placeholder="Search" id="search-input"><button id="search-button">Go!</button>
<div>Results</div>
<div id="results"></div>
CSS
#search-input {
width: 400px;
}
JavaScript
var json_store = {
"links": [
{
"category": "Apply for a License",
"text": "My license application blah blah blah",
"keywords": ["license", "application"],
"href": "https://www.google.com"
},
{
"category": "Apply for a License",
"text": "How do I apply for a license",
"keywords": ["license", "application"],
"href": "https://www.google.com"
},
{
"category": "Renew a License",
"text": "My license renewal blah blah blah",
"keywords": ["license", "renewal"],
"href": "https://www.google.com"
}
]
}
$(document).ready(function(){
$("#search-button").click(function(){
var $results = $("#results");
$results.html("");
var results = [];
var query = $("#search-input").val();
var words = query.split(" ");
_.each(words, function(word){
_.each(json_store.links, function(link){
if (_.contains(link.keywords, word)) {
if (!_.contains(results, link)) {
results.push(link);
}
};
});
});
if (_.size(results)) {
_.each(results, function(result){
var html = $results.html();
var link = "<a href='" + result.href + "'>" + result.text + "</a><br>";
html += link;
$results.html(html);
});
} else {
$results.html("No Results...");
}
});
});