jQuery json没有填充下拉列表MVC5答案

【问题标题】：jQuery json not populating dropdownlist MVC5jQuery json没有填充下拉列表MVC5
【发布时间】：2017-08-08 05:48:39
【问题描述】：

控制器 Json 结果

public JsonResult GetStaffJson( string Branch)
    {
        List<SelectListItem> S_li = new List<SelectListItem>();
        try
        {
            TempData["Staff_List"] =S_li = cmnclass.Get_staff_SelectList(Branch);
        }
        catch (Exception ex)
        {
            logger.LogError(ex);
        }
        finally
        {
        }
        return Json(S_li, JsonRequestBehavior.AllowGet);
    }

查看

        @Html.DropDownListFor(m => m.clsAUDIT.Branch, ViewBag.Branch_list as IEnumerable<SelectListItem>,"Select a Branch", new {@id="ddlBranch", @class = "form-control", @actor = "DropDown" })

还有

        @Html.DropDownListFor(m=>m.clsCGT.fo_Name_CGT, TempData["Staff_List"] as IEnumerable<SelectListItem> , new {@id="ddl_CGT_fo",@class="input-sm", @actor = "DropDown", @style = "width:auto;" })

还有两个

        @Html.DropDownListFor(m => m.clsGRT.GRT_fo_Name, TempData["Staff_List"] as IEnumerable<SelectListItem>, new {@id="ddl_GRT_fo", @class = "input-sm", @actor = "DropDown", @style = "width:auto;" })
        @Html.DropDownListFor(m => m.clsGRT.GRT_bm_name, TempData["Staff_List"] as IEnumerable<SelectListItem>, new { @id = "ddl_GRT_bm", @class = "input-sm", @actor = "DropDown", @style = "width:auto;" })

现在是 Jquery

$('#ddlBranch').change(function () {
        var url = '@Url.Action("GetStaffJson", "Annex1")';
        var Branch = $("#ddlBranch").val();
        var ddl_CGT_fo = $("#ddl_CGT_fo");
        var ddl_GRT_fo = $("#ddl_GRT_fo");
        var ddl_GRT_bm = $("#ddl_GRT_bm");

        $.getJSON(url, { Branch: Branch }, function (response) {
            ddl_CGT_fo.empty();
            ddl_GRT_fo.empty();
            ddl_GRT_bm.empty();
            debugger;
            $.each(response, function (index, item) {
                debugger;
                var p = new Option(item.Text, item.Value);
                ddl_CGT_fo.append(p);
                ddl_GRT_fo.append(p);
                ddl_GRT_bm.append(p);
            });
        });
    });

在更改 ddlBranch 时，我正在填充三个 DropDownList

ddl_CGT_fo
ddl_GRT_fo
ddl_GRT_bm

它工作正常，但只填充最后一个 DropDownList ' ddl_GRT_bm' ，

我在这里缺少什么？为什么前两个 DropDownList 还是空的？

【问题讨论】：

因为同一个元素只能作为一个父元素的子元素存在（当您将其添加到第二个时，它会从第一个中删除，依此类推） - 您需要将 <option> 元素分隔为每个<select>

标签： c# jquery asp.net-mvc json.net asp.net-mvc-5

【解决方案1】：

您应该在附加新创建的选项时使用.clone() 函数。

var p = new Option(item.Text, item.Value);
ddl_CGT_fo.append($(p).clone());
ddl_GRT_fo.append($(p).clone());
ddl_GRT_bm.append($(p).clone());

【讨论】：

谢谢，我做了同样的事情 $('#ddl_GRT_fo').append($('#ddl_CGT_fo').html());