SelectListItem不返回结果 - MVC5

时间:2015-11-04 20:12:32

标签: c# jquery asp.net-mvc model-view-controller asp.net-mvc-5

我尝试了很多不同的帖子和标签以及混合物,但没有在我的选择列表中返回数据。我甚至准备好让一些人在发送之前使用jquery突出显示列表;如果选择实际通过该项目的项目,这是非常可行的!我愿意使用Jquery,我愿意更新模型,我愿意做任何事情来获取模型数据BACK,但似乎所有那些返回count = 0或null。

我正在使用2个列表框,其中有一些移动,并希望在完成后返回两个列表框的内容。

(如果还有另一种方式,请分享!)

型号:

    public class RoleAddRemoveListBoxViewModel
{

    public List<System.Web.Mvc.SelectListItem>  CurrentRoles { get; set; }
    public List<System.Web.Mvc.SelectListItem>  NonMemberRoles { get; set; }



}

控制器:

 [HttpPost]
    public ActionResult ManageUserRoles(string userList)
    {

        List<SelectListItem> lbMemberRoles = new List<SelectListItem>();
        List<SelectListItem> lbNonMemberRoles = new List<SelectListItem>();


        var user = (from u in db.Users
                                where u.UserName == userList
                    select u).SingleOrDefault();

        // prepopulate roles for the view dropdown
        var roleList = db.Roles.OrderBy(r => r.Name).ToList().Select(rr =>
        new SelectListItem { Value = rr.Name.ToString(), Text = rr.Name }).ToList();



        var userRoles = UserManager.GetRoles(user.Id);

        foreach (var role in roleList)
        {
            if (userRoles.Contains(role.Value.ToString()))
            {
                lbMemberRoles.Add(role);
            }
            else
            {
                lbNonMemberRoles.Add(role);   
            }
        }
        RoleAddRemoveListBoxViewModel lbvm = new RoleAddRemoveListBoxViewModel
        {
            CurrentRoles = lbMemberRoles,
            NonMemberRoles = lbNonMemberRoles
        };

        return View(lbvm);
    }

    [HttpPost]
    public ActionResult UpdateUserRoles(RoleAddRemoveListBoxViewModel model)
    {

        TempData["updateState"] = "User Role Updated Successfully!";


        return RedirectToAction("Index");
    }

查看:

@model WebDocEditor.Models.RoleAddRemoveListBoxViewModel
@{
using (Html.BeginForm("UpdateUserRoles", "Roles", FormMethod.Post))
{

    <body>
        <fieldset>
            <form>
                <div class="row">

                    <div class="col-xs-2">
                        @Html.LabelFor(model => model.CurrentRoles)
                    <div>
                       @Html.ListBoxFor(model => model.CurrentRoles, Model.CurrentRoles)

                    </div>
                </div>
                <div class="btn-group-vertical col-xs-1">
                    <div id="moveRightbtn" class="btn glyphicon glyphicon-arrow-right"></div>
                    <div id="moveLeftbtn" class="btn glyphicon glyphicon-arrow-left"></div>
                </div>

                <div class="col-xs-2">
                    @Html.LabelFor(model => model.NonMemberRoles)
                <div>
                    @Html.ListBoxFor(model => model.NonMemberRoles, Model.NonMemberRoles)
                </div>
            </div>

        </div>
        <input type="submit" value="Save" />
        </form>
    </fieldset>
    </body>


}

}

在动作编辑之后:我想投入我用于突出显示的JQuery,因为我看到了很多关于他们如何使用它的线程,并希望显示我的组合/设置有效: JS on View:

@section Scripts
{
    <script type="text/javascript">
    $(document).ready(function () {

    $('#moveRightbtn').on('click', function () {
        var selectedCurrent = $('#CurrentRoles option:selected');
        $('#NonMemberRoles').append($(selectedCurrent).clone());
        $(selectedCurrent).remove()
        //alert(selectedCurrent);

    })

    $('#moveLeftbtn').on('click', function () {
        var selectedNonMember = $('#NonMemberRoles option:selected');
        $('#CurrentRoles').append($(selectedNonMember).clone());
        $(selectedNonMember).remove()
        //alert(selectedNonMember);

    })

    $("#submitBtn").on('click', function (e) {

        $("#CurrentRoles option").prop('selected', 'selected');
        $("#NonMemberRoles option").prop('selected', 'selected');
    });

           });
</script>
}

2 个答案:

答案 0 :(得分:1)

您的列表需要与您返回的内容分开..您应该像这样设置您的模型。

public class RoleAddRemoveListBoxViewModel
{
    public List<System.Web.Mvc.SelectListItem>  CurrentRolesList { get; set; }
    public List<System.Web.Mvc.SelectListItem>  NonMemberRolesList { get; set; }
    public string[] CurrentRoles {get;set;}
    public string[] NonMemberRoles {get;set;}
}

列表框将返回所选内容的数组。在这种情况下,您只需将属性设置为string[]

在您的视图中,使用新属性作为表达式,将List属性用作selectList

@using (Html.BeginForm())
{
    <div class="row">
        <div class="col-xs-2">
            @Html.LabelFor(model => model.CurrentRoles)
            <div>
                @Html.ListBoxFor(model => model.CurrentRoles, Model.CurrentRolesList)
            </div>
        </div>
        <div class="btn-group-vertical col-xs-1">
            <div id="moveRightbtn" class="btn glyphicon glyphicon-arrow-right"></div>
            <div id="moveLeftbtn" class="btn glyphicon glyphicon-arrow-left"></div>
        </div>

        <div class="col-xs-2">
            @Html.LabelFor(model => model.NonMemberRoles)
            <div>
                @Html.ListBoxFor(model => model.NonMemberRoles, Model.NonMemberRolesList)
            </div>
        </div>
    </div>
    <input type="submit" value="Save" />
}
控制器中的

..确保为列表设置正确的属性

public ActionResult ManageUserRoles(string userList)
{

    List<SelectListItem> lbMemberRoles = new List<SelectListItem>();
    List<SelectListItem> lbNonMemberRoles = new List<SelectListItem>();
    var user = (from u in db.Users
                where u.UserName == userList
                select u).SingleOrDefault();

    // prepopulate roles for the view dropdown
    var roleList = db.Roles.OrderBy(r => r.Name).ToList().Select(rr =>
    new SelectListItem { Value = rr.Name.ToString(), Text = rr.Name }).ToList();
    var userRoles = UserManager.GetRoles(user.Id);
    foreach (var role in roleList)
    {
        if (userRoles.Contains(role.Value.ToString()))
        {
            lbMemberRoles.Add(role);
        }
        else
        {
            lbNonMemberRoles.Add(role);
        }
    }
    RoleAddRemoveListBoxViewModel lbvm = new RoleAddRemoveListBoxViewModel
    {
        CurrentRolesList = lbMemberRoles,
        NonMemberRolesList = lbNonMemberRoles
    };

    return View(lbvm);
}

不确定为什么你将这个actionresult作为[HttpPost],但你可能想删除该属性..

列表框的工作方式,它只会回发实际选择的内容..因此,如果要返回其中的所有值,则可能必须选择每个列表中的所有项目

答案 1 :(得分:1)

为返回属性添加string[]

public List<System.Web.Mvc.SelectListItem>  CurrentRoles { get; set; }
public List<System.Web.Mvc.SelectListItem>  NonMemberRoles { get; set; }
public string[] SelectedCurrentRoles{ get; set; }
public string[] SelectedNonMemberRoles{ get; set; }

并在MultiSelectList中使用ListBoxFor。我会使用其他模型传入,但您可以使用现有的List<SelectListItem>

@Html.ListBoxFor(model => model.SelectedCurrentRoles, new MultiSelectList(Model.CurrentRoles, "Value", "Text"))
@Html.ListBoxFor(model => model.SelectedNonMemberRoles, new MultiSelectList(Model.NonMemberRoles , "Value", "Text"))