Active Search

Explanation #

This example actively searches a contacts database as the user enters text.

The interesting part is the input field:

1<input
2    type="text"
3    placeholder="Search..."
4    data-bind-search
5    data-on-input__debounce.200ms="@get('/examples/active_search/search')"
6/>

The input issues a GET to /active_search/search with the input value bound to $search. The __debounce.200ms modifier ensures that the search is not issued on every keystroke, but only after the user has stopped typing.