Jquery filter list without case sensitive -
i want filter list without case sensitive. want match character not match upper case or lower case.
- xxxxxxx
- yyyyyyy
- xxxxx
if enter "x" in search box displays both 1 , 3. added code below match case sensitive also.
<!doctype html> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script> <script> function filter(element) { var value = $(element).val(); $("#thelist > li").each(function() { if ($(this).text().search(value) > -1) { $(this).show(); } else { $(this).hide(); } }); } </script> </head> <body> <input type="text" onkeyup="filter(this)" /> <ul id="thelist"> <li>xxvxvxx</li> <li>yyyyyyyyyy</li> <li>rrrrrrrrrr</li> <li>vvvvvvvvvvv</li> <li>xcvcvdfsdf</li> <li>hkjhkhjkh</li> <li>xzfgfhfgh</li> </ul> </body> </html>
you need use indexof
$(this).text().search(value) supposed be
$(this).text().indexof(value) and why want attach event using attribute tag.it bad practice , should avoided.
you can use jquery attach event.
$('input').keyup(function() { filter(this); }); function filter(element) { var value = $(element).val().tolowercase(); $("#thelist > li").each(function () { var $this = $(this), lower = $this.text; if (lower.indexof(value) > -1) { $this.show(); } else { $this.hide(); } }); } same function little better using filter
function filter(element) { var value = $(element).val().tolowercase(); $("#thelist > li").hide().filter(function() { return $(this).text().tolowercase().indexof(value) > -1; }).show(); }
Comments
Post a Comment