级联下拉列表不起作用

时间:2015-10-13 13:45:43

标签: jquery asp.net-mvc drop-down-menu

我正在尝试在mvc中使用级联下拉列表。一些如何工作,但有一些问题。实际上当第一个视图呈现时我有一个下拉列表基于此下拉列表的帐户类型我必须填充组下拉列表。但是当第一个下拉列表被呈现时,它必须选择房地产经纪人和赞助商默认情况下,房地产经纪人是第一个选择的选项,然后所有与之关联的组都会被渲染。但无法在第一时间获得价值。什么问题可以有人建议我。

这是我的代码

public class ViewModel
{
 [Required]
        public SelectList AccountType { get; set; }
        public string SelectedAccountType { get; set; }
        public IEnumerable<SelectListItem> Group { get; set; }
        public string SelectedGroup { get; set; }
}


[HttpGet]
        public ActionResult Index(ViewModel viewModel)
        {  



            List<SelectListItem> groups = sDbContext.Groups
                    .Where(o => o.GroupId > 1 && o.Deleted == false && o.AccountSubId == 1).OrderBy(uu => uu.GroupName)
                    .Select(o => new SelectListItem()
                    {
                        Value = o.GroupId.ToString(),
                        Text = o.GroupName
                    }).ToList();
            groups.Insert(0, new SelectListItem() { Value = "0", Text = "All" });
            viewModel.Group = groups;
            viewModel.AccountType = new SelectList(sDbContext.AccountTypes.Where(o => o.AccountTypeId != 0), "AccountTypeId", "AccountName");                          
            reportService.GetReportsListGrid();
            return View(viewModel);           
    }

观点:

@model App1.ViewModels.ViewModel
@{
    List<SelectListItem> list = new List<SelectListItem>();   
}
@using (Html.BeginForm("Index", "routee", FormMethod.Post, new { @id = "appForm" }))
{
 Account Type
                                @Html.DropDownListFor(m => m.SelectedAccountType, (IEnumerable<SelectListItem>)Model.AccountType, new { @class = "form-control" })
 @Html.DropDownListFor(model => model.SelectedGroup, list, new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.SelectedGroup)

}

这是我的剧本..

<script type="text/javascript">
 $('#SelectedAccountType').change(function () {
        OnAccountTypeChange();
    });

    function OnAccountTypeChange() {
        var id = $("#SelectedAccountType :selected").val();
        var groupId = $('#SelectedGroup').val();
        if (id != "") {
            alert(id);
            $.ajax({
                type: "GET",
                contentType: "application/json; charset=utf-8",
                url: '@Url.Action("GetGroupsByAccountSubTypeId", "Common", new { area = "" })',
                data: { "AccountSubId": id },
                dataType: "json",
                beforeSend: function () {
                    //alert(id);
                },
                success: function (data) {
                    var items = "<option value='0' selected='selected'>-All-</option>";
                    $.each(data, function (i, groups) {
                        items += "<option value='" + groups.Value + "'>" + groups.Text + "</option>";
                    });
                    $('#SelectedGroup').html(items);
                    if (groupId != undefined || groupId != null || groupId != "")
                        $('#SelectedGroup').val(groupId);
                },
                error: function (result) {
                    console.log('Service call failed: ' + result.status + ' Type :' + result.statusText);
                },
                complete: function () {
                    $('#SelectedGroup').prop('disabled', false);
                }
            });
        }
        else {
            $('#SelectedGroup').html(items);
        }
    }
</script>

1 个答案:

答案 0 :(得分:1)

只是一个简单的错误。你为什么在这里使用列表

@Html.DropDownListFor(model => model.SelectedGroup, list, new { @class = "form-control" })

您的代码应该像:

@Html.DropDownListFor(model => model.SelectedGroup, (IEnumerable<SelectListItem>)Model.Group, new { @class = "form-control" })