Question

我的页面上需要3个下拉列表。它们的工作方式如下：

用户必须从第一个下拉列表中选择以查看第二个下拉列表中的列表。第二次和第三次以同样的方式工作。

索引方法填充第一个下拉列表：

    [HttpGet]
    public ActionResult Index()
    {
        ViewBag.ClientDropdownList = GetClientsDropDown();
        return View();
    }

用户从第一个下拉列表中选择任何项目后：

$(function () {
    $('#clientDropdown').change(function () {
        var val = $(this).val();
        $.ajax({
            type: "POST",
            url: '/Home/GetClientsProjectsDropDown',
            data: { 'data': val },
            success: function (data) {
            },
            error: function (data) {
            }
        });
    });
});

转发到：

        [HttpPost]
        public ActionResult GetClientsProjectsDropDown(string data)
        {
            if (!String.IsNullOrEmpty(data))
            {
                var result = new List<SelectListItem>();
                var clientProjects = _clientService.GetClientsProjects(Int32.Parse(data));
                foreach (var proj in clientProjects)
                {
                    var item = new SelectListItem()
                    {
                        Value = proj.ProjectID.ToString(),
                        Text = proj.ProjectName
                    };
                    result.Add(item);
                }
                TempData["ProjectDropdownList"] = result;
                return RedirectToAction("Index");
            }
            return PartialView();
        }

这是index.cshtml：

<div style="display: inline-flex; text-align: center;">
                <div class="dropdown">
                    @Html.DropDownListFor(m => m.Client, ViewBag.ClientDropdownList as List<SelectListItem>, "Clients", new { @id = "clientDropdown", @class = "form-control" })
                </div>
                <div id="projectDropdown" class="dropdown" style="margin-left: 10px;">
                    @if (TempData["ProjectDropdownList"] != null)
                    {
                        @Html.DropDownListFor(m => m.Project, TempData["ProjectDropdownList"] as List<SelectListItem>, "Projects", new { @id = "projectDropdown", @class = "form-control" })
                    }
                    else
                    {
                        @Html.DropDownListFor(m => m.Project, new List<SelectListItem>(), "Projects", new { @id = "projectDropdown", @class = "form-control" })
                    }
                </div>
                <div class="dropdown" style="margin-left: 10px;">
                    @Html.DropDownListFor(m => m.Task, new List<SelectListItem>(), "Tasks", new { @id = "taskDropdown", @class = "form-control" })
                </div>
            </div>

为什么第二次下拉列表没有更新？

Answer 1

您的成功回调是空的：

 success: function (data) {
    },

data参数应该包含控制器的部分HTML。您应该将此HTML添加到DOM。例如，

    success: function (data) {
         $('#dropdown2Wrapper').add(data);
    },

显然，您需要使用id＆＃34; dropdown2Wrapper＆＃34;创建一个div。或者将此引用更改为相应的jQuery选择器。

C＃MVC不更新Html.DropDownListFor

1 个答案: