如何返回此数据并填充 Select 元素答案

【问题标题】：How to return this data and populate a Select element如何返回此数据并填充 Select 元素
【发布时间】：2013-05-30 18:40:27
【问题描述】：

好的，我相信我拥有正确返回所需数据所需的一切，但我不知道如何返回。

我有一个带有级联下拉框的页面，该下拉框通过 JQuery 填充另一个框。我目前有 jQuery().change() 甚至编码，我有模型编码，我有选择元素编码。我只需要控制器方面的帮助。

这是我希望 HTML 的外观（当然，如果有更好或不同的方式也可以）。

AD_DepartmentProfile 填充了部门经理和每个直接下属。我需要弄清楚如何将这些数据返回到 Select 元素中。

<select id="owner" name="owner">
        <optgroup label="Manager">
            <option value="john">John Dow</option>
        </optgroup>
        <optgroup label="Members">
                <option value="jane">Jane Doe</option>
                <option value="josh">Josh Doe</option>
        </optgroup>
</select>

这是我的模型：

public class AD_DepartmentProfile
    {
        public AD_DepartmentProfile()
        {
            this.AD_UserProfile = new HashSet<AD_UserProfile>();
            this.AD_ManagerProfile = new AD_UserProfile();
        }

        public string name { get; set; }

        public virtual AD_UserProfile AD_ManagerProfile { get; set; }
        public virtual ICollection<AD_UserProfile> AD_UserProfile { get; set; }
    }

public class AD_UserProfile
    {
        public string distinguishedName { get; set; }
        public string email { get; set; }
        public string manager { get; set; }
        public string name { get; set; }
        public string userPrincipalName { get; set; } // Useful if we need to allow a user to 'log on' as a different user.  
        public string userName { get; set; } 
    }

这是我的 Jquery：

jQuery('#departmentID').change(function () {
        var department = jQuery('#departmentID');
        var value = department.val();
        var text = department.children("option").filter(":selected").text();
        GetOwnerList(value, text);
    });

function GetOwnerList(departmentid, departmentText) {
    jQuery('#owner').find('option').remove();

    jQuery.getJSON("/MasterList/GetOwners/" + departmentid, null, function (data) {
        var html;
        var len = data.length;
        for (var i = 0; i < len; i++) {
            if (data[i] && data[i] != "") html += '<option value = "' + data[i].functionID + '">' + data[i].name + '</option>';
        }
        jQuery('#owner').append(html);
        jQuery('#owner').trigger('liszt:updated');
    });

这里是控制器：

public ActionResult getOwners(int id = 0)
{
     //  Load up the department record
     Department department = db.Department.Find(id);

     // loads up the manager and direct reports into the model.
     AD_DepartmentProfile dp = new ActiveDirectory().GetDepartmentInfo(department.name, department.owner);
}

【问题讨论】：

标签： c# linq asp.net-mvc-4 razor active-directory

【解决方案1】：

要在您的选择列表中进行分组，您需要编写一些自定义内容。看看这个扩展：

Support for optgroup in dropdown

从那里，您可以使用控制器来提供视图。只需替换为您决定使用的任何扩展名：

控制器：

ViewData["Manager"] = new SelectList(db.GetAllManagers(), "Manager", "Manager");

查看：

@Html.DropDownGroupList("ManagerDescription",(SelectList)ViewData["Manager"])

【讨论】：

我在等待回复的同时搞砸了它并想出了如何去做。已发布答案。
不错。是的，我想我误解了你的问题，并打算使用父下拉列表。

【解决方案2】：

这是我正在使用的控制器：

public ActionResult GetOwners(int id = 0)
        {
            Departments department = db.Department.Find(id);

            AD_DepartmentProfile dp = new ActiveDirectory().GetDepartmentInfo(department.name, department.owner);

            return this.Json(dp, JsonRequestBehavior.AllowGet);
        }

这是我对 jQuery 所做的更改。

function GetOwnerList(departmentid, departmentText) {
    jQuery('#owner').find('option').remove();

    jQuery.getJSON("/MasterList/GetOwners/" + departmentid, null, function (data) {
        var html;
        var len = data.AD_UserProfile.length;
        console.log(data);
        if (data.AD_ManagerProfile.name != null) {
            html += '<optgroup label="Manager">';
            html += '<option value = "' + data.AD_ManagerProfile.username + '">' + data.AD_ManagerProfile.name + '</option>';
            html += '</optgroup>';
        }

        if (len != 0) {
            html += '<optgroup label="Members">';
            for (var i = 0; i < len; i++) {
                html += '<option value = "' + data.AD_UserProfile[i].username + '">' + data.AD_UserProfile[i].name + '</option>';
            }
            html += '</optgroup>';
        }

        jQuery('#owner').append(html);
        jQuery('#owner').trigger('liszt:updated');
    });
}

【讨论】：