60 lines
1.9 KiB
HTML
60 lines
1.9 KiB
HTML
{**
|
|
* Looks for input fields like
|
|
* <input type="text" class="filter-list" rel="target" />
|
|
* and filters out anchors below $(target) which do not match
|
|
* the entered input.
|
|
*}
|
|
<script type="text/javascript" charset="utf-8">
|
|
{literal}
|
|
$(document).ready(function() {
|
|
$("input.filter-list").each(function() {
|
|
var input = $(this);
|
|
var lists = $("ul#" + input.attr("rel"));
|
|
if (lists.length == 0)
|
|
return;
|
|
var list = $(lists[0]);
|
|
var wrapper = input.parent();
|
|
|
|
// a list should contain a reasonable amount of items
|
|
// to be filterable - we also give the filter input a
|
|
// special class here so we recognize it later in case
|
|
// we have to hide it when the list view is collapsed
|
|
if (list.children("li").length > 10) {
|
|
wrapper.addClass("activated");
|
|
input.focus(function() {
|
|
// ensure that the parent of the list keeps activated / opened
|
|
list.parent().addClass("activated");
|
|
if (input.attr("value") == input.attr("title")) {
|
|
input.attr("value", "");
|
|
wrapper.removeClass("default");
|
|
}
|
|
});
|
|
input.blur(function() {
|
|
list.parent().removeClass("activated");
|
|
if (input.attr("value").length == 0) {
|
|
input.attr("value", input.attr("title"));
|
|
wrapper.addClass("default");
|
|
}
|
|
});
|
|
input.keyup(function(ev) {
|
|
var filter = $(this)[0];
|
|
list.children("li").css('display', 'block');
|
|
list.children("li").filter(function(index) {
|
|
if (filter.value == "")
|
|
return false;
|
|
if ($(this).text().indexOf(filter.value) > -1)
|
|
return false;
|
|
return true;
|
|
}).css('display', 'none');
|
|
});
|
|
wrapper.children('span').click(function() {
|
|
input.val('').keyup().blur();
|
|
});
|
|
// initialize it with the default
|
|
input.val('').blur();
|
|
}
|
|
});
|
|
});
|
|
{/literal}
|
|
</script>
|