javascript - dropdown text doesnt' change

Question

I have two dropdown fields: (DropDownA and DropDownB) and a checkbox

When checkbox is checked, DropDownA gets the same text, value, and selected index of DropDownB and gets disabled.

The problem is:

I can change all these attributes but on the screen DropDownA dosen't get refreshed so the seen text is still the same, altougth the text attribute changes as can see with an alert

var x=document.getElementById("nazione_pr").selectedIndex;
        var y=document.getElementById("nazione_pr").options;
        var w=document.getElementById("nazione_spedizione").selectedIndex;
        var z=document.getElementById("nazione_spedizione").options;
        alert (y[x].text);
        alert (z[w].text);
        //w=x;
        document.getElementById("nazione_spedizione").selectedIndex = document.getElementById("nazione_pr").selectedIndex;
        z[w].text=y[x].text;
        alert (z[w].text);
        document.getElementById("nazione_spedizione").disabled=true;
        $("nazione_spedizione").trigger("liszt:updated");

i should need somthing like reloading the < select > UI

Answer 1

I suppose this will help you.

JS FIDDLE

<select id="dropdownA">
     <option value="volvo">Volvo</option>
     <option value="saab">Saab</option>
     <option value="mercedes">Mercedes</option>
     <option value="audi">Audi</option>
</select>
<select id="dropdownB">
       <option value="volvo">Volvo</option>
     <option value="saab">Saab</option>
     <option value="mercedes">Mercedes</option>
     <option value="audi">Audi</option>
</select>
<input type="checkbox" id="checkbox1" name="chk" value="check">check



$(document).ready(function() {

    $('#checkbox1').change(function() {
        if($(this).is(":checked")) {
          var selectedtext=$('#dropdownA>option:selected').text();
             var selectedvalue=$('#dropdownA>option:selected').val();
             var index=$('#dropdownA>option:selected').index();

            $('#dropdownB').val(selectedvalue);
            $('#dropdownB').selectedIndex=index;

        }

    });
});