Select array based on which option is selected

Adam84

I have a set of arrays each with a series of objects inside. And I want to select the array depending on which select option is chosen.

<select  id="job" name="job">
    <option value="job_1">job_1</option>
    <option value="job_2">job_2</option>
    <option value="job_3">job_3</option>
</select>

I have a function that selects the option on change. I have tried using an if statement to select the option that matches the option select but it keeps returning only the first array.

var selectedValue;
        $("#job").change(function() {
            selectedValue = $("#job option:selected").val();
            return selectedValue;
        }).change();

        if(selectedValue == "job_1"){

            var country_data = [
{"country_id":1,"country":"Luxembourg","local_wage":"407","wage":"489","exchange":"0.98"},
{"country_id":2,"country":"Norway","local_wage":"3200","wage":"378","exchange":"9.57"},
{"country_id":3,"country":"Austria","local_wage":"290","wage":"337","exchange":"0.87"}
];

        }


        else if(selectedValue == "job_2"){


var country_data = [
{"country_id":1,"country":"Luxembourg","local_wage":"874","wage":"654","exchange":"0.24"},
{"country_id":2,"country":"Norway","local_wage":"741","wage":"365","exchange":"4.77"},
{"country_id":3,"country":"Austria","local_wage":"854","wage":"634","exchange":"0.43"}
];

        } 
        else if(selectedValue == "job_3") {


var country_data = [
{"country_id":1,"country":"Luxembourg","local_wage":"854","wage":"985","exchange":"0.25"},
{"country_id":2,"country":"Norway","local_wage":"645","wage":"874","exchange":"5.55"},
{"country_id":3,"country":"Austria","local_wage":"201","wage":"256","exchange":"0.78"}
];

                }

Any suggestions would great.

Ricard Fredin

Presently that if statement only runs once on page load and at that time the only selected item is the job_1.

Your if statement needs to run when the select box change event is running.

I created a fiddle with a short example based on your code which also includes printing the current object to show the chosen data: http://jsfiddle.net/6a1ux1ot/6/

Short preview:

$("#job").change(function () {
    selectedValue = $("#job option:selected").val();

    if (selectedValue == "job_1") {
        ...
    }
}).change();

This is an updated fiddle http://jsfiddle.net/u1z7c696/1/ that works like you want. The problem was that your fiddle didn't include my fix for your first issue. You never ran your if statement in your change event handler so the country_data variable never got updated. There were also a few other js-errors I fixed with regards to declaration of variables.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

Disable select in which option is selected

From Dev

How to disable <select> option based on other <select> option selected?

From Dev

Change options in same select based on selected option

From Dev

Change select options based on another selected option

From Dev

Select option selected an not selected

From Dev

jquery count select dropdown which are not disabled and have specific option selected

From Dev

ng-class for select depending on which option is selected

From Dev

Filtering array based on selected checkboxes and select fields

From Dev

Display table row based on the selected option of Select html tag

From Dev

Change background color select element based on the selected option dynamically

From Dev

Disable/Enable a text box based on radio/select option selected Javascript

From Dev

How to select a checkbox based on an datalist option selected (different pages)

From Dev

Angular 2: How to make an option in a select to selected based on a condition?

From Dev

Update select options based on other selected option from database

From Dev

Display based on Option Selected

From Dev

Make <select> option selected

From Dev

Change which select gets displayed based on another select option, and maintain same option value

From Dev

Which <option> field is selected? With jQuery

From Dev

setting a select option by another select selected option

From Dev

how to populate Ember.Select options via computed property based on selected option of another Ember.Select

From Dev

PHP - Select array based on value of which is within array

From Dev

Why does IE (IE8, specifically) not highlight selected option in a multi select box which is disabled?

From Dev

jQuery select option based on array doesn't work in Safari

From Java

Set select option 'selected', by value

From Java

Set selected option of select box

From Dev

How to set the selected option of <select>

From Dev

Disable Select Option if already selected

From Dev

Meteor select option selected in with loop

From Dev

How to set the selected option of <select>

Related Related

  1. 1

    Disable select in which option is selected

  2. 2

    How to disable <select> option based on other <select> option selected?

  3. 3

    Change options in same select based on selected option

  4. 4

    Change select options based on another selected option

  5. 5

    Select option selected an not selected

  6. 6

    jquery count select dropdown which are not disabled and have specific option selected

  7. 7

    ng-class for select depending on which option is selected

  8. 8

    Filtering array based on selected checkboxes and select fields

  9. 9

    Display table row based on the selected option of Select html tag

  10. 10

    Change background color select element based on the selected option dynamically

  11. 11

    Disable/Enable a text box based on radio/select option selected Javascript

  12. 12

    How to select a checkbox based on an datalist option selected (different pages)

  13. 13

    Angular 2: How to make an option in a select to selected based on a condition?

  14. 14

    Update select options based on other selected option from database

  15. 15

    Display based on Option Selected

  16. 16

    Make <select> option selected

  17. 17

    Change which select gets displayed based on another select option, and maintain same option value

  18. 18

    Which <option> field is selected? With jQuery

  19. 19

    setting a select option by another select selected option

  20. 20

    how to populate Ember.Select options via computed property based on selected option of another Ember.Select

  21. 21

    PHP - Select array based on value of which is within array

  22. 22

    Why does IE (IE8, specifically) not highlight selected option in a multi select box which is disabled?

  23. 23

    jQuery select option based on array doesn't work in Safari

  24. 24

    Set select option 'selected', by value

  25. 25

    Set selected option of select box

  26. 26

    How to set the selected option of <select>

  27. 27

    Disable Select Option if already selected

  28. 28

    Meteor select option selected in with loop

  29. 29

    How to set the selected option of <select>

HotTag

Archive