Показать выбранное значение при использовании html.dropdownlistfor

Question

Я использую

@Html.DropDownListFor(x => x.Selects, new SelectList(Model.Selects, "Value", "Text", Model.Select), "Select"})` 

для раскрывающегося списка, чтобы показать список американских государств. Текст, который я хочу показать это AL Алабама, Калифорния Калифорния, Нью-Йорк и др .... смотрите ниже

<option value="AL">AL Alabama</option> 
<option value="CA">CA California</option> 
<option value="NY">NY New York</option> 
.... 

значение атрибута имеет государственную аббревиатуру. То, что я хочу достичь, когда пользователь делает выбор, то выбранное значение в пользовательском интерфейсе должно показывать аббревиатуру состояния, а не имя состояния. В настоящее время отображается название состояния аббревиатуры. Может кто-нибудь мне помочь?

Answer 1

Самым простым решением было бы просто использовать свойство Value в два раза (как в качестве значения опции и как внутренний текст):

@Html.DropDownListFor(x => x.Selects, 
    new SelectList(Model.Selects, "Value", "Value", Model.Select), "Select"}) 

В случае, если бы, во-первых хотел показать имя состояния и то только после того, как выбор пользователя изменит его на аббревиатуру состояния, вы должны обработать это через Javascript.

Чтобы сделать это с помощью JavaScript, вы должны сначала установить идентификатор вашего выпадающего списка и назначить соответствующую onChange функции:

@Html.DropDownListFor(x => x.Selects, 
    new SelectList(Model.Selects, "Value", "Text", Model.Select), "Select"}, 
    , new {@id="selectListId" onchange = "setText(this)"}) 

Тогда Реализуйте функцию:

function setText(sel) { 
    var selectedItem = sel.options[sel.selectedIndex]; 
    selectedItem.text = selectedItem.value; 
    //or  
    //$("#selectListId option:selected").text(selectedItem.value); 
}