Второй выпадающий список выбранного элемента не изменяется в ASP.NET MVC

Question

Меня немного смущает поведение ASP.NET MVC, когда он не меняет значение раскрывающегося списка после POST. Может кто-нибудь объяснить, как это сделать.

Прежде всего, у меня есть модель, которая выглядит следующим образом:

public class Test
{
    public int OneID { get; set; }
    public IEnumerable<SelectListItem> OneList
    {
        get
        {
            yield return new SelectListItem
            {
                Text = "Red",
                Value = "0"
            };
            yield return new SelectListItem
            {
                Text = "Green",
                Value = "1"
            };
            yield return new SelectListItem
            {
                Text = "Blue",
                Value = "2"
            };
        }
    }

    public int TwoID { get; set; }
    public IEnumerable<SelectListItem> TwoList
    {
        get
        {
            yield return new SelectListItem
            {
                Text = "Ruby",
                Value = "0"
            };
            yield return new SelectListItem
            {
                Text = "Gem",
                Value = "1"
            };
            yield return new SelectListItem
            {
                Text = "Bronze",
                Value = "2"
            };
        }
    }
}

Представление содержит следующий фрагмент кода в содержании тела:

<% using (Html.BeginForm("Index", "Home", FormMethod.Post))
   { %>
<table>
    <tr>
        <td>
            <% =Html.DropDownList("OneID", Model.OneList, new 
                  { @onchange = "this.form.submit();" })%>
        </td>
        <td>
            <% =Html.DropDownList("TwoID", Model.TwoList)%>
        </td>
    </tr>
</table>
<% } %>

А действия GET и POST выглядят так:

public ActionResult Index()
{
    Test test = new Test();
    test.OneID = 0;
    test.TwoID = 0;
    return View(test);
}

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Index(Test test)
{
    test.TwoID = test.OneID;
    return View(test);
}

Я пытаюсь добиться изменения выбранного элемента во втором раскрывающемся списке, чтобы он соответствовал первому раскрывающемуся списку при каждом изменении первого раскрывающегося списка. Таким образом, я получаю выбранное значение из первого выпадающего списка и присваиваю его идентификатору, используемому для второго выпадающего списка, а затем возвращаю ту же модель. Первый выпадающий список правильно установлен в виде, но не второй.

Идеи

Answer 1

Причина, по которой это не работает так, как вы ожидаете, заключается в том, что когда помощник DropDownList пытается отобразить элемент select, он сначала ищет опубликованные значения, соответствующие name, который в данном случае равен TwoID, и используйте это значение вместо значения в модели. Это то же самое с TextBox, например. Если вы используете этот помощник и в действии контроллера POST изменяете значение модели, оно все равно будет показывать старое значение. Вот так работают помощники. Они связываются с POSTed-значениями.

Существует два возможных решения:

1. Используйте JavaScript для синхронизации обоих выпадающих списков:

   @onchange = "document.getElementById('TwoID').value = this.value; this.form.submit();"
   

   Кстати, это должно быть сделано незаметно в отдельном файле javascript:

   $(function() {
       $('#OneID').change(function() {
           $('#TwoID').val($(this).val());
           this.form.submit();
       });
   });
   

2. Напишите свой собственный помощник или сгенерируйте выборку вручную (не рекомендуется)