CODEWITHSUNDEEP
javascriptjqueryarrays
juns
juns

Reputation: 3

How can I show array results using jQuery conditional statement?

I am trying to pull store locations using conditional statements. When I search for Dealer, Wholesale, or retail respectively from select option menu, the results are displayed. However, I cannot display all the location if All is selected. If I remove &&(locationData['category']=== 'Dealer' || 'Wholesale' ||'Retail'), I can show All the locations, but I can't display store locations based on each category. How can I set up a conditional statement?

This is what I have in HTML:

<select id="category" name="category">
    <option value="" selected>All</option>
    <option value="Dealer">Wholesale &amp;Retail</option>
    <option value="Wholesale">Wholesale</option>
    <option value="Retail">Retail</option>
</select>

This is what I have in js

if(settings.maxDistance === true && firstRun !== true){ 
    if((locationData['distance'] < maxDistance)&&(locationData['category']=== 'Dealer' || 'Wholesale' ||'Retail')) {
       locationset[i] = locationData;
    } else {
       return;
     }
    } else {
       locationset[i] = locationData;
    }
    i++;
    });
}

Upvotes: 0

Views: 210

Answers (1)

jfriend00
jfriend00

Reputation: 707416

I'm not entirely sure what question you're asking so I'll answer several things that are going on in your question.

If you want to know how to get the value from the select object, you can do that like this:

$("#category").val()

If you want to know how to detect the "All" choice, then you should change your HTML to this (set a value for the "All" item):

<select id="category" name="category">
     <option value="All" selected>All</option>
     <option value="Dealer">Wholesale &amp;Retail</option>
     <option value="Wholesale">Wholesale</option>
     <option value="Retail">Retail</option>
</select>

And you can check for it with a conditional like this:

if ($("#category").val() === "All") {
    // All is selected
}

I also see in your code that you have an error in your conditional. You can't compare to multiple things like this:

&&(locationData['category']=== 'Dealer' || 'Wholesale' ||'Retail')

You have to compare to each one separately:

&& (locationData['category']=== 'Dealer' || locationData['category'] === 'Wholesale' || locationData['category'] === 'Retail')

Or, using a temporary variable to hold the comparison value, your code could look like this:

if (settings.maxDistance && !firstRun) { 
    var item = locationData['category'];
    if((locationData['distance'] < maxDistance) && (item === 'Dealer' || item === 'Wholesale' || item === 'Retail')) {
        locationset[i] = locationData;
    } else {
        return;
    }
} else {
    locationset[i] = locationData;
}

If you do this a lot, sometimes, it's useful to make a static object that you can use as a lookup table:

var categories = {Dealer: true, Wholesale: true, Retail: true};
if (settings.maxDistance && !firstRun) { 
    if((locationData['distance'] < maxDistance) && (categories.hasOwnProperty(locationData['category'])) {
        locationset[i] = locationData;
    } else {
        return;
    }
} else {
    locationset[i] = locationData;
}

Upvotes: 1

Related Questions