从 DropDownList 将数据发布到 MVC 控制器

Posted 2023-04-01

【中文标题】从 DropDownList 将数据发布到 MVC 控制器

【英文标题】：Post data to MVC controller from DropDownList

【发布时间】：2021-11-09 02:41:15

【问题描述】：

我有一个 MVC，多选 DropDownList 填充来自 SelectListItem 模型的选择项。

@html.DropDownList("EmployeeStatuses", (IEnumerable<SelectListItem>)ViewBag.EmployeeStatuses, new multiple = "multiple", style = "width: 100%;", @class = "select2", onchange = "UpdateEmployeeStatusFilter()", id = "employee-status-type" )

当用户从DropDownList 中选择或取消选择项目时，我想在我的控制器中运行一个方法来过滤视图中的数据。这是通过onChange 事件UpdateEmployeeStatusFilter() 完成的。

<script type="text/javascript">
    function UpdateEmployeeStatusFilter() 
      var value = $('#employee-status-type').val();
      console.log(value);
      var a = ["X", "Y", "Z"];
      console.log(a);
      $.ajax(
        type: 'POST',
        url: '@Url.Action("SearchEmployee", "Employee")',
        data:  valueMember: value ,
        dataType: 'json',
        traditional: true,
        success: function (msg)  alert(msg) 
    );

    ;
  </script>

当我调试脚本时，我可以获得value 的值并将其写入控制台窗口。调用控制器方法时，值为null。

public IActionResult SearchEmployee(string itemsSelected)

    // Do Stuff with itemsSelected
    return RedirectToAction("Index");

我的问题是如何将该值输入到我的控制器中？

我不确定这段代码是否相关，但为了清楚起见，我会包含它。

public IActionResult Index()

    // Get Employment Statuses
    IEnumerable<SelectListItem> statuses = _mockDataRepository.GetEmployeeStatuses().Select(c => new SelectListItem
    
        Value = c.ValueMember,
        Text = c.DisplayMember,
        Selected = c.ValueMember == "AC"
    );
    ViewBag.EmployeeStatuses = statuses;

public class SelectListItem

    [Key]
    public string ValueMember  get; set; 
    public string DisplayMember  get; set; 
    public int SortOrder  get; set;  = 0;

【参考方案1】：

名称不匹配。 SearchEmployee() 操作方法具有 itemsSelected 输入参数。因此在.ajax调用中设置相同的参数名称：

data:  itemsSelected: value , 

【讨论】：

Ugg，这就是问题所在。你至少可以做的是让它看起来更困难一点！就像其他人的注释一样，由于值在数组中，我不得不更改行 var value = $('#employee-status-type').val(); to var value = new Array($('#employee-status-type').val());