Question

我的html页面上有一个固定的选项下拉列表。它包含三个选项（按名称，按视图，按喜欢），用于对页面上显示的数据进行排序。当下拉列表中的值发生变化时，我正在提交表单，控制器会根据所选的排序选项返回更新的数据。但是下拉列表中的选定选项会重置为第一个选项。如何在下拉列表中设置所选选项。

我需要提交表单，不要发送ajax请求。

Answer 1

您需要使用.val()在下拉列表中设置所选值。试试这个$('#YourDropDownList').val(SelectedOrderBy);

Answer 2

如果您有一些java脚本连接到下拉列表的更改事件，并且您在那里调用form.submit()，则与您使用提交按钮提交表单相同（您的页面正在从服务器）。

您需要确保您的视图模型具有可以保存下拉列表中所选项目的属性。

拥有这样的视图模型

public class CriteriaVM
{
    public IEnumerable<SelectListItem> SortItems { set; get; }
    public String SelectedSortItem { set; get; }

    public CriteriaVM()
    {
        this.SortItems=new List<SelectListItem>();
    }
}

现在，在您的GET操作方法中，您正在加载SortItems集合并在视图中呈现它。

public ActionResult Index()
{
    var vm = new CriteriaVM {SortItems = GetItems()};
    return View(vm);
}

private List<SelectListItem> GetItems()
{
    return new List<SelectListItem>
    {
        new SelectListItem {Value = "Name", Text = "Name"},
        new SelectListItem {Value = "City", Text = "City"}
    };
}

，您的观点是

@model YourNameSpaceHere.CriteriaVM
@using (Html.BeginForm())
{
    @Html.DropDownListFor(s=>s.SelectedSortItem,Model.SortItems,"Select")
    <input type="submit" />
    <div>Selected  : @Model.SelectedSortItem</div>
}
<script type="text/javascript">
   //Assuming jQuery library is included in the page
    $(function() {
       //whenever user changes the drop down,submit the form
        $("#SelectedSortItem").change(function() {
            $("#SelectedSortItem").closest("form").submit();
        });
    });
</script>

在HttpPost操作中，确保在加载SelectedSortItem属性后显式设置SortItems属性。

[HttpPost]
public ActionResult Index(CriteriaVM model)
{
    var selected = model.SelectedSortItem;
    model.SortItems = GetItems();
    model.SelectedSortItem = selected;

    return View(model);
}

如何在asp.net mvc中提交表单后保留选中的选项？

2 个答案: