我目前正在使用MVC中的一个网站，每次在DropDownList中选择一个值时，我都会使用DropDownListFor创建一个局部视图 . 它会转到HttpPost并将值添加到List中 . 我还有一个绑定到此列表的ListBoxFor .
我想要实现的目标：
每次使用DropDownListFor向List添加新值时，它应自动更新ListBoxFor，以便将所选值添加到此Listbox . 我想知道实现这一目标的最佳方法是什么 .
码：
Submit.cshtml：
<div class="create-ingredient">
@Html.Partial("_CreateIngredient")
</div>
<div class="add-ingredient">
@Html.Partial("_AddIngredient")
</div>
<div class="ingredient-listbox">
@Html.LabelFor(model => model.Ingredients,"Current Ingredients")
@Html.ListBoxFor(model => model.Ingredients, new MultiSelectList(Model.SelectedIngredients), new { style = "width:50%;" })
</div>
_AddIngredient.cshtml（部分视图）：
@model Recepten.Models.IngredientSelectModel
@using (Ajax.BeginForm("AddIngredient", "Recipe", new AjaxOptions() { UpdateTargetId = "add-ingredient", HttpMethod = "Post" }))
{
@Html.LabelFor(model => model.Ingredients, "Add Ingredient")
@Html.DropDownListFor(model => model.SelectedIngredient, Model.Ingredients, "Select Ingredient", new { @onchange = "$(this).parents('form').submit();" })
}
AddIngredient：
[HttpPost]
public ActionResult AddIngredient(IngredientSelectModel ing)
{
ing.SelectedIngredients.Add(ing.SelectedIngredient);
return PartialView(ing);
}
IngredientSelectModel：
public RecipeModel Recipe { get; set; }
public IEnumerable<SelectListItem> Ingredients { get; set; }
public int SelectedIngredient { get; set; }
public string addIngredient { get; set; }
public List<int> SelectedIngredients { get; set; }
public IngredientSelectModel()
{
SelectedIngredients = new List<int>();
}
感谢您的时间！
2 回答
我认为你工作的是
AddIngredient为AddIngredient动作创建和更新的IngredientSelectModel与用于填充ListBox的动作是分开的 .如果正确设置了Ajax和不显眼的JQuery（浏览器URL不应该将选定的值发送到操作，但是ajax数据中包含了
SelectedIngredients. 为了实现这一点，您需要将多选更改为被绑定到SelectedIngredients：...并在表单声明中移动它，以便将其值与要添加的新成分一起发布到操作中 .
也就是说，我不会说你做了足够的工作来证明往返服务器的合理性，所以在完成上述更改后你可以在客户端完全添加这样的成分，如下所示：
我相信一个解决方案是将ListBoxFor帮助器移动到您的局部视图中，以便在您的操作返回局部视图时更新并重新创建它 .
Submit.cshtml：
_AddIngredient.cshtml（部分视图）：