JS - jQuery inarray ignoreCase() and contains()

Question

well, I am more of a PHP person, and my JS skills are close to none when it comes to any JS other than simple design related operations , so excuse me if I am asking the obvious .

the following operations would be a breeze in PHP (and might also be in JS - but I am fighting with unfamiliar syntax here ...)

It is some sort of input validation

var ar = ["BRS201103-0783-CT-S", "MAGIC WORD", "magic", "Words", "Magic-Word"];

    jQuery(document).ready(function() {
        jQuery("form#searchreport").submit(function() {
        if (jQuery.inArray(jQuery("input:first").val(), ar) != -1){ 
                jQuery("#contentresults").delay(800).show("slow");

            return false;
          }

This question has 2 parts .

1 - how can I make it possible for the array to be case insensitive ?

E.g. - BRS201103-0783-CT-S will give the same result as brs201103-0783-ct-s AND Brs201103-0783-CT-s or MAGIC magic Magic MaGIc

basically i need something like ignoreCase() for array , but I could not find any reference to that in jQuery nor JS...

I tried toLowerCase() - but It is not working on the array (ittirating??) and also, would it resolve the mixed case ?

2 - How can I make the function to recognize only parts or combinations of the elements ?

E.g. - if one types only "word" , I would like it to pass as "words" , and also if someone types "some word" it should pass (containing "word" )

For 1, I'd just type your JS array in lowecase then call if (jQuery.inArray(jQuery("input:first").val().toLowerCase(), ar) != -1){, the second part of the questions seems a little too broad. What are the specific rules? word is contained in words ok, but some word is not contained in words. — Fabrício Matté
– Fabrício Matté, Commented Jul 16, 2012 at 0:51
thanks for the comment , what I meant is some word contains word and also words contains word(part of string...) — Obmerk Kronen
– Obmerk Kronen, Commented Jul 16, 2012 at 0:58
Ok, strangest thing . putting val().toLowerCase() will work on a word like "magic/MAgIc" - but now it returns false the string BRS201103-0783-CT-S no matter how I enter it (small case letters , upper case or mixed.. — Obmerk Kronen
– Obmerk Kronen, Commented Jul 16, 2012 at 1:07
Most likely because magic is lowercase in your array, while BRS201103-0783-CT-S is not. Check alex's answer, he posted a simple function to pass your whole array to lowercase. :) — Fabrício Matté
– Fabrício Matté, Commented Jul 16, 2012 at 1:09
Ok, I am checking it now, but only for understanding better , if my array will be all lower case , than every input case will pass ? — Obmerk Kronen
– Obmerk Kronen, Commented Jul 16, 2012 at 1:13

Community · Accepted Answer · 2017-05-23 12:09:20Z

8

Part 1

You can process your array to be entirely lowercase, and lowercase your input so indexOf() will work like it's performing a case insensitive search.

You can lowercase a string with toLowerCase() as you've already figured out.

To do an array, you can use...

arr = arr.map(function(elem) { return elem.toLowerCase(); });

Part 2

You could check for a substring, for example...

// Assuming you've already transformed the input and array to lowercase.
var input = "word";
var words = ["word", "words", "wordly", "not"];

var found = words.some(function(elem) { return elem.indexOf(input) != -1; });

Alternatively, you could skip in this instance transforming the array to be all lowercase by calling toLowerCase() on each elem before you check indexOf().

some() and map() aren't supported in older IEs, but are trivial to polyfill. An example of a polyfill for each is available at the linked documentation.

As Fabrício Matté also pointed out, you can use the jQuery equivalents here, $.map() for Array.prototype.map() and $.grep() with length property for Array.prototype.some(). Then you will get the browser compatibility for free.

edited May 23, 2017 at 12:09

CommunityBot

11 silver badge

answered Jul 16, 2012 at 0:54

alex

492k205 gold badges890 silver badges992 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Fabrício Matté Over a year ago

As OP has experience with PHP, may as well add that JS's indexOf() works similarly to PHP's strpos, except that indexOf returns -1 for no match instead of false as PHP does and the syntax/parameters is slightly different.

Obmerk Kronen Over a year ago

@alex . Thanks . as much as your answer seems logic , the 1st part is not working for me somehow (maybe I am applying it wrong ??) - It returns true on lower but still false on upper .. I had put it like a new VAR var arr = ar.map(function(elem) { return elem.toLowerCase(); }); and then if (jQuery.inArray(jQuery("input:first").val(), arr) != -1) (Note that my original array was called "ar" and not "arr" . is the culprit there ?

alex Over a year ago

You still need to call toLowerCase() on the input's value, e.g. jQuery("input:first").val().toLowerCase().

Obmerk Kronen Over a year ago

.. stupid little me . I had it there from @Fabrício Matté reply, and then deleted . Thanks , all works just great . and more importantly - I have actually learned something :-) (to double check the code of masters before saying it is not working :-) )

Fabrício Matté Over a year ago

I'll +1 as well, I didn't know that .map() is implemented in JS 1.6. Using jQuery's .map() would provide compatibility with IE6-8 which the native JS .map doesn't.

|

Jose Manuel Gomez Alvarez · Accepted Answer · 2016-10-18 17:59:41Z

1

To check if an array contains an element, case-insensitive, I used this code:

    ret = $.grep( array, function (n,i) {
        return ( n && n.toLowerCase().indexOf(elem.toLowerCase())!=-1 );
    }) ;

Here is a fiddle to play with array match case insensitive

edited Oct 18, 2016 at 17:59

answered Oct 17, 2016 at 22:20

Jose Manuel Gomez Alvarez

2,30425 silver badges34 bronze badges

Collectives™ on Stack Overflow

JS - jQuery inarray ignoreCase() and contains()

2 Answers 2

Part 1

Part 2

7 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Part 1

Part 2

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related