CODEWITHSUNDEEP
javascriptjqueryarrays
zen
zen

Reputation: 1165

Using two arrays in an if then statement

I'm trying to simplify many if then statements into just one if statement with 2 arrays.

So if I have this:

if (city == 'Atlanta'){
    jQuery('#cit').HTML('Atlanta');
    jQuery('#pho').HTML('555-555-5555');
}
else if (city == 'Portland'){
    jQuery('#cit').HTML('Portland');
    jQuery('#pho').HTML('666-666-6666');
}
else if (city == 'StLouis'){
    jQuery('#cit').HTML('St Louis');
    jQuery('#pho').HTML('777-777-7777');
}

I'm trying to simplify it so that it's just in two or three arrays with only one if statement. Such as [Atlanta, Portland, StLouis], [Atlanta, Portland, St Louis], [555-555-5555, 666-666-6666, 777-777-7777] that way it's easier to edit in the future, plus it would be editable by someone without good knowledge of JS.

Any ideas how to achieve such a thing?

Upvotes: 3

Views: 180

Answers (5)

Derek Henderson
Derek Henderson

Reputation: 9706

Create an object and refer to it, without having to use loops and conditionals:

var cities = {
    Atlanta: {
        name: 'Atlanta',
        phone: '555-555-5555'
    },
    Portland: {
        name: 'Portland',
        phone: '666-666-6666'
    },
    StLouis: {
        name: 'St. Louis',
        phone: '777-777-7777'
    }
};

$('#cit').text(cities[city].name);
$('#pho').text(cities[city].phone);

Upvotes: 4

DaveB
DaveB

Reputation: 9530

Put the cities into an array of object literals, then you can loop through the array and populate the page elements with data from the object.

var cities = [
{code: 'Atlanta', name: 'Atlanta', phone: '555-555-5555'},
{code: 'Portland', name: 'Portland', phone: '666-666-6666'},
{code: 'StLouis', name: 'St Louis', phone: '777-777-7777'},
];

for(var i = 0, l = cities.length; i < l; i++){
    if(cities[i].code===city) {
       jQuery('#cit').HTML(cities[i].name);
       jQuery('#pho').HTML(cities[i].phone);

     }
}

Upvotes: 1

azzy81
azzy81

Reputation: 2269

instead of using an if statement consider using a switch like so

jQuery('#cit').HTML(city);
switch(city)
{
   case"Atlanta":
     jQuery('#pho').HTML('555-555-5555');
   break;
   case"Portland":
     jQuery('#pho').HTML('666-666-6666');
   break;
   case"StLouis":
     jQuery('#pho').HTML('777-777-7777');
   break;
}

The person editing would just need to add, remove and edit the 'case's in the switch. there is no limit to amount of cases you can have in a switch.

Upvotes: 1

teemo
teemo

Reputation: 75

Use Json to store your data like thie

var cities = {
    Atlanta:{name:'Atlanta',pho:'555-555-5555'},
    Portland:{name:'Portland',pho:'333-333-333'}    
}

then you can fetch the value like this:

jQuery('#cit').HTML(cities['Atlanta'].name);

Upvotes: 4

user142162
user142162

Reputation:

Store the data in an object with the city as the key and an array as the value, which hold the real name and phone number:

var data = {
    'Atlanta':  ['Atlanta', '555-555-555'],
    'Portland': ['Portland', '666-666-6666'],
    'StLouis':  ['St Louis', '777-777-7777'],
    // ...
};
jQuery('#cit').HTML(data[city][0]);
jQuery('#pho').HTML(data[city][1]);

Upvotes: 9

Related Questions