Is there a way to add an ID to the options generated by HTML.Dropdownfor?-CodePudding

I am trying to use jquery to modify visible options on a dropdown, the code for my drop down is as follows: @Html.DropDownListFor(Model => Model.order.CurrencyFrom, Model.CurrencyFrom, new { @onchange = "DropdownSelector(this.value)" }),

this generates the following HTML

<select id="order_CurrencyFrom" name="order.CurrencyFrom" onchange="DropdownSelector(this.value)">
<option value="BTC">BTC</option>
<option value="GBP">GBP</option>
<option value="ETH">ETH</option>
</select>

Is there anyway to assign the options a ID?

I tried this however it only adds the ID to the select element

@Html.DropDownListFor(Model => Model.order.CurrencyFrom,
  Model.CurrencyFrom,
  new { @onchange = "DropdownSelector(this.value)", @id = "Dropdown1" }),

CodePudding user response：

I added an on change command to the first drop down and used the following code to change the second dropdown

var lastremoved;

function DropdownSelector(fromCurrency) {

    var option = document.createElement('option');
    var CurrencyToDropdown = document.getElementById("order_CurrencyTo");

    if (lastremoved != undefined) {
        option.text = lastremoved;
        CurrencyToDropdown.appendChild(option);
    }

    CurrencyToDropdown.remove(fromCurrency);
    lastremoved = fromCurrency;


}