###Author: Ian Maffett
This plugin allows you to filter an unordered list or ordered list. It will create an input box above the list for you to filter.
To use this, call .filterlist on an App Framework collection
$(document).ready(function(){
$("#list").filterList({revealElements:false,perPage:3,caseInsensitive:true});
});
When you create the list, we cache the items in the list for performance. If you update them, you must call refresh
$("#list").filterList("refresh");
The idea is that we are filtering
<li><a href="#test">Test</a>
<li>Test</a>
We allow two data attributes to be set
-
data-filter="foo" //We will filter against that value instead
-
data-ignore="true" //Ignore this item when filtering
#Options
var opts {
caseInsensitive: false, //Fasle = case sensitive search. true = case insensitive
perPage: null, //Setting this will allow you to page the options
revealElements:false, //Setting this to true will hide all elements and only show the matching ones
cbFunc:function(){} //Comparison function to use. We have a built in one, so it's best to leave this blank
}
#Sample
<html>
<head>
<link rel="stylesheet" type="text/css" href="af.filterlist.css">
<script src="https://raw.github.com/01org/appframework/2.0/appframework.js"></script>
<script src="af.filterlist.js"></script>
<script>
$(document).ready(function(){
$("#list").filterList({revealElements:false,perPage:3,caseInsensitive:true});
});
</script>
</head>
<body>
<div style='width:200px;border:1px solid black;'>
<ul id='list'>
<li><a href="#foo" data-filter="foo">One - data-filter="foo"</a></li>
<li><a href="#foo">Two</a></li>
<li><a href="#foo">Three</a></li>
<li><a href="#foo">Four</a></li>
<li><a href="#foo">Five</a></li>
<li><a href="#foo" data-ignore="true">Six (we ignore this one)</a></li>
<li>Seven</li>
</ul>
</div>
</body>
</html>
Please use github to report any bugs found. Please provide the following
-
Any error messages from the console
-
Line numbers of offending code
-
Test cases
-
Description of the Error
-
Expected result
-
Browser/Device you are testing on
This plugin is licensed under the terms of the MIT License, see the included license.txt file.