Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery .inArray() always true?

Tags:

arrays

jquery

I'm trying to use inarray but its always returning true? Any ideas? (all li's are showing)

$("#select-by-color-list li").hide();

// get the select
var $dd = $('#product-variants-option-0');

if ($dd.length > 0) { // make sure we found the select we were looking for

    // save the selected value
    var selectedVal = $dd.val();

    // get the options and loop through them
    var $options = $('option', $dd);
    var arrVals = [];
    $options.each(function(){
        // push each option value and text into an array
        arrVals.push({
            val: $(this).val(),
            text: $(this).text()
        });
    });




};

//This is where it is returning true...


if($.inArray('Aqua', arrVals)) {
    $("#select-by-color-list li#aqua").show();
    };
    if($.inArray('Army', arrVals)) {
    $("#select-by-color-list li#army").show();
    };
like image 561
Charles Marsh Avatar asked Dec 29 '10 21:12

Charles Marsh


People also ask

What is inArray in jQuery?

The jQuery inArray() method is used to find a specific value in the given array. If the value found, the method returns the index value, i.e., the position of the item. Otherwise, if the value is not present or not found, the inArray() method returns -1. This method does not affect the original array.

How do you check if a value exists in an array in jQuery?

1) Using jQuery If you are someone strongly committed to using the jQuery library, you can use the . inArray( ) method. If the function finds the value, it returns the index position of the value and -1 if it doesn't.

How check array is empty or not in jQuery?

We can use jQuery's isEmptyObject() method to check whether the array is empty or contains elements. The isEmptyObject() method accepts a single parameter of type Object, which is the object to be checked and returns a boolean value true if the object is empty and false if not empty.


2 Answers

You need to do this:

if( $.inArray('Aqua', arrVals) > -1 ) {

or this:

if( $.inArray('Aqua', arrVals) !== -1 ) {

The $.inArray() method returns the 0 based index of the item. If there's no item, it returns -1, which the if() statement will consider as true.

From the docs:

Because JavaScript treats 0 as loosely equal to false (i.e. 0 == false, but 0 !== false), if we're checking for the presence of value within array, we need to check if it's not equal to (or greater than) -1.


EDIT: Instead of pushing both values into the array as an object, just use one or the other, so you have an Array of strings from which you can build a multiple selector.

One way is like this:

  // Create an Array from the "value" or "text" of the select options
var arrVals = $.map( $dd[0].options, function( opt, i ){
    return opt.value || opt.text;
});

  // Build a multiple selector by doing a join() on the Array.
$( "#" + arrVals.join(',#') ).show();

If the Array looks like:

['Army','Aqua','Bread'];

The resulting selector will look like:

$( "#Army,#Aqua,#Bread" ).show();
like image 191
user113716 Avatar answered Sep 23 '22 21:09

user113716


ES6 to the rescue! Although not jQuery I thought worth answering for future readers...

ES6 introduces .includes() which works as you think $.inArray SHOULD work:

const myArray = ["a", "b", "c"];

console.log(myArray.includes("a")) /* true */
console.log(myArray.includes("d")) /* false */

Array.prototype.includes()

like image 30
StudioTime Avatar answered Sep 24 '22 21:09

StudioTime