How to get just one value from array in javascript

Question

i'm learning javascript and i've tried something but i can't figure out how to make it work, here's my code so far:

HTML

<p>Busca tu auto:</p>
<input type="text" id="search"><span> </span><button>Submit</button>
<p class="hide h1" style="color:green">Your car is available.</p>
<p class="hide h2" style="color:red">Your car is not available.</p>

JS

$(document).ready(function(){
    var cars = ['mercedes','nissan','ferrari','bmw','fiat','toyota','renault','peugeot','kia'];
    $('.hide').hide();
    $('button').click(function(){
        if($('#search').val() == cars[x]){
            $('.h1').show();
            $('.h2').hide();
        } else {
            $('.h2').show();
            $('.h1').hide();
        };
    });
});

What I want to do is that when you click the button check if the car is available (it's not real). For example, it you type "mazda" and click the button, h2 will show, but if you type "ferrari" and click the button, h1 will show.

I'm approaching to the solution with my code above or not?

NOTE: if you change the "x" in cars[x] for a number it works, but just with one car.

Syntax · Accepted Answer · 2014-05-04 01:48:20Z

3

Array.prototype.indexOf

$(document).ready(function(){
    var cars = ['mercedes','nissan','ferrari','bmw','fiat','toyota','renault','peugeot','kia'];
    $('.hide').hide();
    $('button').click(function(){
        if(cars.indexOf($('#search').val()) !== -1){
            $('.h1').show();
            $('.h2').hide();
        } else {
            $('.h2').show();
            $('.h1').hide();
        };
    });
});

http://jsfiddle.net/CWHDv/

answered May 4, 2014 at 1:48

Syntax

2,14316 silver badges15 bronze badges

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

Comments

Joeytje50 · Accepted Answer · 2014-05-04 01:48:58Z

You can search through arrays by using the Array.indexOf method:

if (cars.indexOf($('#search').val()) !== -1) {
    //your code here
}

The Array.indexOf method will return -1 when no exact matches are found (this includes lowercase/uppercase differences), and otherwise it will return the index of the match in the array. That means that if the entered value is in your array, it will return something other than -1, so the if-statement will return true.

To make this case-insensitive, use the following:

if (cars.indexOf($('#search').val().toLowerCase()) !== -1) {
    //available
} else {
    //unavailable
}

that converts the input to lowercase first, and checks afterwards. For this to work, all values stored in the array would need to be in all lowercase letters too, like your example shows.

Jeremy J Starcher · Accepted Answer · 2014-05-04 04:34:22Z

1

Since this question is also tagged jQuery:

From the jQuery docs:

jQuery.inArray( value, array [, fromIndex ] )

Which would be:

$.inArray(('#search').val(), cars) !== -1

This also has the advantage of working in IE8 and below, something that Array.prototype.indexOf does not.

answered May 4, 2014 at 4:34

Jeremy J Starcher

24k6 gold badges56 silver badges75 bronze badges

Collectives™ on Stack Overflow

How to get just one value from array in javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related