Question

I have a form with a bunch of inputs, including cities. Other inputs either need to be shown or hidden depending on the cities the user has selected.

I have two arrays:

var biking_cities = ['newyork',];
var cars_cities = ['newyork','newjersey','metronorth','longisland','boston','chicago','sanfrancisco','london','paris','washington',];

So if any of the cities = newyork, then the biking input needs to be hidden. Same for “cars”.

The city inputs all look like this:

<input class="city" type="hidden" name="city1" value="foo">
<input class="city" type="hidden" name="city2" value="foo">

And so on (max 9 cities).

What’s an efficient way to create an array and check it against other arrays and then do something in case they match?

Thanks,
Brian

Answer 1

Check each city input and hide the appropriate elements:

$("input.city").each(function() {
    if (biking_cities.indexOf($(this).val()) != -1) hide_biking_input();
    if (cars_cities.indexOf($(this).val()) != -1) hide_cars_input();
});

Where hide_biking_input and hide_cars_input hide the inputs that I assume are elsewhere in your code.

The result is that if any of the class=city hidden inputs you have contains an element in biking_cities, the biking input gets hidden and similarly for cars_cities.