asked on

populate dropdownlist with JSON and jquery how to load selected state

Hi,
I am relatively new to jquery, JSON and the whole MVC structure.

I am doing a webpage for work and one of the dropdownlist has all US states in it. So I found a JSON file with all state names and abbreviations.. so I have it loading by

$(document).ready(function () {
    'use strict';
    $.getJSON("../../JSON/States.json", function (data) {
        var states = data.States;

        $.each(states, function (id, states) {
            $("#SelectState").append("<option value='" + states.abbreviation + "'>" + states.name + "</option>");
        });

    });   
});

Open in new window

and when I select a state it saves the abbreviation like it should but if I press to go to the Edit page I can't get the selected value to show up on the dropdownlist as selected, it always goes to the first state.

I tried

$(document).ready(function () {
       $("#SelectState").Selected($("#hidState").val());
});

Open in new window

but it did nothing( I tried alert($("#hidState").val()); and it did pop up with the right value.
How can I get the value to be selected.

Thank you in advance for any help

ASKER CERTIFIED SOLUTION

leakim971

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

leakim971

or :

$(document).ready(function () {
       $("#SelectState option[value='" + $("#hidState").val() + "']").prop('selected', true);
});

Open in new window

Niall Gallagher

ASKER

Thanks Leakim971,

Your first response worked perfectly. I didn't try your second option.

Thanks again

Sorry, I responded a bit quick

I kept the alert in when trying it but when I removed the alert it doesn't change anymore, any idea what might be wrong??