vendredi 14 août 2015

How to handle a kendo multiselectfor in foreach statement

Situation

I have a list of users, which inturn has a list of roles which I want to see editable in a kendo multiselectfor.

Problem

With the code that I have it turns out very weird, at the top it display a bunch of textboxes (for my opinion) and at the place where the multiselect boxes should be all I see are up and down arrows.

My code so far:

foreach (var u in Model.Users)
{
<div class="form-group">
    <div class="col-sm-2">
        @Html.Label(u.Name)
    </div>
    <div>
        @Html.Kendo().MultiSelectFor(m => u.Roles).BindTo(Model.UserRoles);
    </div>
</div>
}

Viewmodel

public class CompanyViewModel
{
    public IEnumerable<UserDto> Users { get; set; }
    public IEnumerable<UserRoleDto> UserRoles { get; set; }
}

UserDto

public class UserDto
{
    public int Id { get; set; }
    public string FirstName { get; set; }
    public string MiddleName { get; set; }
    public string LastName { get; set; }
    public string Name
    {
        get
        {
            return string.Format("{0} {1} {2}", FirstName, MiddleName, LastName);
        }
    }

    public IEnumerable<SelectListItem> Roles { get; set; }
}

Here's a snippet of what the page looks like when I render it like this

div class="k-widget k-multiselect k-header" unselectable="on" title style>

div class="k-multiselect-wrap k-floatrap" unselectable="on">...</div>

div class="k-widget k-multiselect k-header" unselectable="on" title style>

div class="k-multiselect-wrap k-floatrap" unselectable="on">...</div>

div class="k-widget k-multiselect k-header" unselectable="on" title style>

div class="k-multiselect-wrap k-floatrap" unselectable="on">...</div>

div class="k-widget k-multiselect k-header" unselectable="on" title style>

div class="k-multiselect-wrap k-floatrap" unselectable="on">...</div>

and this keeps repeating itself some more times.

I suspect there is an issue with how I make the multiselectfor based on the user instead of something from the model but my knowlage of kendo is to low to understand how it should be done.

Any help would be much appreciated

Aucun commentaire:

Enregistrer un commentaire