Question

我有一个简单的HTML表单，其中dropdwonListFor绑定到颜色，下面是一个textBox，并提交按钮以提交表单并保存颜色。

当我从下拉列表中选择一种颜色时，如果用户点击提交表单，它将更改其下方文本框的值。它返回到控制器，我从texebox保存颜色并返回视图（模型）作为操作结果，但dropdownlistfor没有使用文本框的值更新的问题是否在文本框内的值是否有下拉列表。

顺便说一句，你可以自己测试一下有人可以帮忙吗？

Model.cs

public class TestModel {
    public String Color { get; set; }
}

Controller.cs

public ActionResult Index() {
        var model = new TestModel();
        model.Color="Blue";
        ViewData["Colors"]=new List<SelectListItem>() { new SelectListItem() { Text =  "Blue", Value = "Blue" }, new SelectListItem() { Text = "Red", Value = "Red" } };
        return View(model);
    }

[HttpPost]
public ActionResult Index(TestModel model) {
        model.Color="Red";
        ViewData["Colors"]=new List<SelectListItem>() { new SelectListItem() { Text =  "Blue", Value = "Blue" }, new SelectListItem() { Text = "Red", Value = "Red" } };
        return View(model);
}

Index.cs

@using (Html.BeginForm()) {
@Html.DropDownListFor(m => m.Color, ViewData["Colors"], new { @class = "w200" })
<input type="submit" />

}

Answer 1

<强>模型

public class TestModel {
    public String Color { get; set; }
    public SelectList Colors {get;set;} }

<强>控制器

public ActionResult Index() {
        var model = new TestModel();
        model.Color="Blue";
        var colors =new List<SelectListItem>() { new SelectListItem() { Text =  "Blue", Value = "Blue" }, new SelectListItem() { Text = "Red", Value = "red" } };
        model.Colors = new SelectList(colors,"Text","Value");

        return View(model);
    }

[HttpPost] public ActionResult Index(TestModel model) {
        model.Color="Red";

        var colors =new List<SelectListItem>() { new SelectListItem() { Text =  "Blue", Value = "Blue" }, new SelectListItem() { Text = "Red", Value = "red" } };
        model.Colors = new SelectList(colors,"Text","Value");

        return View(model); }

查看

@using (Html.BeginForm()) {
    <div>
        @Html.DropDownListFor(m => m.Color, Model.Colors, new { @class = "w200" })
       <input type="submit" />
     </div> 
}

Answer 2

您需要在Post动作中包含所有颜色。

也不要使用ViewData，而是将项目添加到您查看模型：

public class TestModel {
    public String Color { get; set; }
    IEnumerable<SelectListItem> AvailableColors {get;set;}
}

但是，由于视图模型旨在用于抽象模型，您可以执行以下操作：

public class TestModel {
    public TestModel(IEnumerable<string> colors)
    {
        AvailableColors = colors.Select(c => new SelectListItem{Text=c, Value = c});
    }

    public String Color { get; set; }
    IEnumerable<SelectListItem> AvailableColors {get;}
}

在你的控制器中：

public ActionResult Index() {
    var model = new TestModel(new string[]{"Red", "Green", "Blue"});
    model.Color="Blue";
    return View(model);
}

Answer 3

为了使下拉列表更改所选内容，您必须将与文本框值对应的选择列表项的Selected属性设置为true。这样的事情:(注意：我没有编译和测试它。可能需要调整才能编译它。而且，我认为如果颜色不在列表中，则应该添加它。）

[HttpPost]
public ActionResult Index(TestModel model) {
        model.Color="Red";
        var colors = new List<SelectListItem>() { new SelectListItem() { Text =  "Blue", Value = "Blue" }, new SelectListItem() { Text = "Red", Value = "Red" } };

        SelectListItem selectedColor = colors.Where(c => c.Text == model.Color).FirstOrDefault();
        if (selectedColor != null)
        {
            selectedColor.Selected = true;
        }
        else
        {
            colors.Add(new SelectListItem() { Text = model.Color; Value = model.Color; Selected = true; };
        }
        ViewData["Colors"] = colors;
        return View(model);
}

修改

在进行一些测试和挖掘之后，您似乎需要使用javascript来执行此操作，如此SO question中所述。另一种选择是推出自己的助手。

Answer 4

好的，问题不在于你实现这种情况的方式，这里的问题是ModelState。我POST到Action并返回相同的视图。第二次呈现视图时，它将查看ModelState并使用这些值来填充控件。因此，我们需要在返回View之前清除ModelState。

Model.cs

public class TestModel {
    public String Color { get; set; }
}

Controller.cs

public ActionResult Index() {
        var model = new TestModel();
        model.Color="Blue";
        ViewData["Colors"]=new List<SelectListItem>() { new SelectListItem() { Text =  "Blue", Value = "Blue" }, new SelectListItem() { Text = "Red", Value = "Red" } };


        return View(model);
    }

[HttpPost]
public ActionResult Index(TestModel model) {
        model.Color="Red";
        ViewData["Colors"]=new List<SelectListItem>() { new SelectListItem() { Text =  "Blue", Value = "Blue" }, new SelectListItem() { Text = "Red", Value = "Red" } };

        ***ModelState.Clear();***
        return View(model);
}

Index.cs

@using (Html.BeginForm()) {
@Html.DropDownListFor(m => m.Color, ViewData["Colors"], new { @class = "w200" })
<input type="submit" />

}

Cheeeeeers

MVC3 HTML帮助程序在提交表单时不会更新DropdownListFor

4 个答案: