HTML input search doesn't find uppercase vise versa

Question

This code doesn't find UPPERCASE if searched for with lowercase uppercase vise versa same for lowercase, if searched for LOWERCASE. I was thinking of making the input and data-label to lowercase with jquery before searching, but how?

jsfiddle code here

Can someone help, thanks

just make a comparison using toUpperCase() and toLowerCase()....pretty straight forward — Ohgodwhy
– Ohgodwhy, Commented Jun 29, 2013 at 19:32
I am no jquery Guru ... Could you modify the jsfiddle code so it works? Thanks — MOTIVECODEX
– MOTIVECODEX, Commented Jun 29, 2013 at 19:33
You can find solution here stackoverflow.com/questions/5671238/… — mkutyba
– mkutyba, Commented Jun 29, 2013 at 19:34

000 · Accepted Answer · 2013-06-29 19:37:18Z

Here's an updated fiddle for you http://jsfiddle.net/jdmTZ/5/

Remove the data attribute and add it in code:

 $('.filter li').each(function() { $(this).attr('data-label', $(this).text().toLowerCase()); });

Then search by lowercased input

 var input = $(this).val().toLowerCase();

Yogu · Accepted Answer · 2013-06-29 19:40:40Z

Replace line 14 by this:

var matched = $("ul li").filter(function() { return $(this).data('label').toLowerCase().indexOf(input.toLowerCase()) >= 0; });

And change the show()/hide() logic:

$('ul li').hide(); matched.show(); matched = matched.length;

Complete fiddle

This also eliminates the problem of someone entering ] or some other special character - that would break the CSS rule in your code.

Manoj Yadav · Accepted Answer · 2013-06-29 19:38:39Z

1

Use toLowerCase() and $.each Updated js fiddle code

answered Jun 29, 2013 at 19:38

Manoj Yadav

6,6121 gold badge25 silver badges21 bronze badges

Collectives™ on Stack Overflow

HTML input search doesn't find uppercase vise versa

3 Answers 3

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Linked

Related