Alon Shmiel
Alon Shmiel

Reputation: 7121

Searched option doesn't works in lower and upper cases

I made a search option in my jsfiddle: http://jsfiddle.net/alonshmiel/46wyH/33/

so I have a value (value is the searched text).

I search all of the li that contains the value: value

// hide all the lists
$('#searchExcludeResult li').each(function() {       
      $(this)[0].style.display = "none";
});

// show all the li that contains the value: value
$('#searchExcludeResult li:contains(' + value + ')').each(function() {       
    $(this)[0].style.display = "list-item";
    $(this)[0].innerHTML = $(this)[0].textContent.replace(value, 
                                '<span style="font-weight: bold">' + value + '</span>');
});

it works, but I want it to work no matter the searched text is in lowercase or uppercase.

for example:

<ul>
    <li>United States</li>
    <li>London, England</li>
    <li>Moskow, Russia</li>
</ul>

and the searched text is: e, show the first (unit e d stat e s) and the second li (London, E ngland).

the searched text can be EN, eN, l, L, etc..

any help appreciated!

Upvotes: 1

Views: 64

Answers (2)

Fiddle Demo

Use .filter() and match .toLowerCase() .text().

$('#searchExcludeResult li').filter(function () {
    return $(this).text().toLowerCase().indexOf(value.toLowerCase()) !== -1;
}).each(function () {

Upvotes: 2

Kiran
Kiran

Reputation: 20313

You can change the .contains filter to be case insensitive or create your own selector.

jQuery.expr[':'].contains = function(a, i, m) {
 return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
};

DEMO

Upvotes: 1

Related Questions