如何立即获取C＃MVC中下拉框所选项目的更新值？

Question

我有一个基于用户选择需要过滤的“实践”列表。 我的视图有一个下拉列表，如下所示：

@Html.DropDownList("practice", (List<SelectListItem>)ViewBag.PracticeList)

它允许用户从6种左右的方法中选择一种来过滤另一个列表。 我需要检索值并更新页面。 我在页面上填充了默认值，而无需考虑实践过滤器，我只是无法更新它，因为我似乎无法检索到该值。 我只需要获取此值，即可将其合并到循环中以重建列表。

@foreach (var item in Model)
{      
<tr>
    <td>
        @Html.DisplayFor(modelItem => item.User.FirstName)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.User.LastName)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.User.Email)
    </td>
    <td>
        @Html.TextBox("Hours")
    </td>        
</tr>
}

Answer 1

首先使用jquery捕获select中的更改：

$('#selectList').on('change', function() {

})

小提琴

然后，ajax到一个控制器，该控制器将返回您的其他项目：

$.ajax({
    url: '@Url.Action("Action","Controller")',
    data: { 'selection' : $(this).val() },
    type: "post",
    cache: false,
    success: function (items) {
        //update the other select
    };
});

使用剃刀：

@using (Ajax.BeginForm("Action", "Controller", new AjaxOptions {UpdateTargetId = "DivToUpdate"}))
{
    @Html.DropDownList("practice", (List<SelectListItem>)ViewBag.PracticeList, new { onchange="this.form.submit()"})
}

然后，您可以从控制器返回该下拉列表，或者但是要处理该列表。

编辑

实际上，我认为您不能像嵌套表单那样使用Ajax.BeginForm方法。 您可能会陷入jQuery

Answer 2

您还可以使用@ Ajax.BeginForm并在控制器的操作中返回部分视图，并将其呈现在ajax表单的成功处理程序的客户端上。

这是@ Ajax.BeginForm上的帖子

在MVC4中使用Ajax.BeginForm

但是您将必须具有一个jquery脚本，该脚本会在您的select change事件上提交表单。

Answer 3

您可以像这样使用AjaxBeginFormfor：

@model YourModel
        @using (Ajax.BeginForm("Action", "Controller", null,
                            new AjaxOptions { HttpMethod = "POST",
                                OnSuccess = "functionIfYouWant(data)",
                                 UpdateTargetId = "divid",
                                 InsertionMode=InsertionMode.InsertAfter},
                                new { id = "formId" }))
     {
       @Html.DropDownListFor(c=>c.SelectedVal, (List<SelectListItem>)ViewBag.PracticeList)
    <div id="divId">

    </div>
        <input type="submit" value="Submit"/>
//or add @Html.DropDownListFor(c=>c.SelectedVal, //  List<SelectListItem>)ViewBag.PracticeList,new {onChange="jQuery("#formId").submit()"})
        }

现在，您可以将模型发布到控制器，并且返回的内容将追加到具有id =“ divId”的div内容中，希望您理解我要解释的内容。 另外请尽量避免在应用中使用ViewBag不是一个好习惯。请尝试在模型中使用SelectlistItem来填充下拉列表。 因此，假设您有自己的模型：

public class Model
{
public int SelectedItem{get;set;}
public IList<DropDownObj> ListObj{get;set;
public IList<SelectListItem> SelectListItemListObj{get;set;}
        {
            get
            {
                   var list = (from item in ListObj
                            select new SelectListItem()
                            {
                                Text = item.Id.ToString(CultureInfo.InvariantCulture),
                                Value item.Name
                            }).ToList();
                return list;
            }
            set{}
        } 
} 

public class DropDownObj
{
   public int Id{get;set;}
   public string Name{get;set;
}

在控制器中，您需要设置（从db或从某处填充）您的DropDownObj列表。 并且鉴于您将能够执行以下操作：

@Html.DropDownListFor(c=>c.SelectedItem,Model.SelectListItemListObj)

这就是mvc dropdownlsit在mvc中的外观。