HTML and CSS Reference
In-Depth Information
if(value.length > 0){
document.getElementById('taskbar').classList.add('searchactive');
} else {
document.getElementById('taskbar').classList.remove('searchactive');
}
_searchTimeout = setTimeout(function(){
_self.search(value);
}, 1000);
});
...
}
The reason for setting a timeout on the input is so that a request isn't
sent as soon as a user types a letter. As you can't cancel a JSONP
request and the request may come back in a random order, it's best to
avoid a situation where lots of requests are made at any one time by
setting a one-second timer.
The full code for the bind method can be seen next.
/**
* Binds the search form
*/
this.bindSearchForm = function(){
/**
* Here you add an event listener to the search filed using
* the focus event listener. If there's a value, then show the
* results.
*/
_searchfield.addEventListener('focus', function(){
if(this.value.length > 0){
app.utility.deck.showCard('card-movie_search_results');
}
});
/**
* Add an event listener to the submission of the form.
* This will prevent the form from being submitted
* and sent to another page. Instead, we capture the
* event and trigger the search action.
*/
_searchform.addEventListener('submit', function(e){
e.preventDefault();
clearTimeout(_searchTimeout);
var value = _searchfield.value;
 
Search WWH ::




Custom Search