Super simple de mise en œuvre de la zone de liste à sélection multiple dans l'affichage Modifier

À l'aide de MVC4 ici avec les objectifs EF et CF (mal)

J'ai une classe comme ceci:

public class Feature
{
    public int ID { get; set; }
    public string Desc { get; set; }
}

Et l'un comme ceci:

public class Device   //change to Devices
{
    public int ID { get; set; }
    public string Name { get; set; }
    public virtual ICollection<Feature> Features { get; set; }
}

Sur la vue d'Édition pour le modèle de l'Appareil, je voudrais qu'il y ait une zone de liste qui contient tous les éléments de la Fonction de modèle (Desc propriété affichée) avec les caractéristiques contenues dans l'appareil.Collection de fonctionnalités pré-sélectionnés.

Ensuite, lorsque l'utilisateur clique sur Enregistrer dans la vue d'Édition, la collection actuelle des éléments sélectionnés dans la zone de liste est écrit sur l'appareil les Caractéristiques de la collection.

Quel est le code du contrôleur et cshtml ressembler à ce truc?

Je vous remercie pour votre temps,
Dave

OriginalL'auteur davecove | 2013-08-21

  1. 16

    Comme toujours, vous pourriez commencer par la rédaction d'un modèle de vue de satisfaire les exigences de la vue que vous avez décrit:

    public class EditDeviceViewModel
{
    public IEnumerable<int> SelectedFeatures { get; set; }
    public IEnumerable<SelectListItem> Features { get; set; }
    public int ID { get; set; }
    public string Name { get; set; }
}

    et puis votre contrôleur:

    public class DeviceController : Controller
{
    public ActionResult Edit(int id)
    {
        Device device = (go get your device from your repository using the id)
        IList<Feature> features = (go get all features from your repository)

        //now build the view model
        var model = new EditDeviceViewModel();
        model.ID = device.ID;
        model.Name = device.Name;
        model.SelectedFeatures = device.Features.Select(x => x.ID);
        model.Features = features
            .Select(x => new SelectListItem
            {
                Value = x.ID.ToString(),
                Text = x.Name,
            })
            .ToList();

        //pass the view model to the view
        return View(model);
    }

    [HttpPost]
    public ActionResult Edit(EditDeviceViewModel model)
    {
        //model.SelectedFeatures will contain the selected feature IDs here
        ...
    }
}

    et enfin la vue:

    @model EditDeviceViewModel

@using (Html.BeginForm())
{
    @Html.Html.HiddenFor(x => x.ID)
    <div>
        @Html.LabelFor(x => x.Name)
        @Html.EditorFor(x => x.Name)
    </div>
    <div>
        @Html.LabelFor(x => x.SelectedFeatures)
        @Html.ListBoxFor(x => x.SelectedFeatures, Model.Features)
    </div>

    <button type="submit">Edit</button>
}
    Lorsque je charge le point de vue, toutes les fonctionnalités de l'appareil a déjà dans sa collection ne sont pas pré-sélectionné dans la liste, et à chaque fois que je clique sur un élément dans la liste, je reçois un jScript erreur : exception non Gérée à la ligne 1234, colonne 5 dans localhost:52321/Scripts/jquery.validate.js 0x800a138f - runtime JavaScript erreur: Impossible d'obtenir la propriété "appel" undefined ou référence null
    Oui, vous avez raison, j'ai oublié la suite dans l'action du controller: model.SelectedFeatures = device.Features.Select(x => x.ID);. C'est ce qui va présélectionner les valeurs présentes dans l'appareil. Aussi loin que l'erreur de javascript que vous obtenez, eh bien, c'est quelque chose à votre avis, un code que vous n'avez pas indiqué, donc je ne peut pas lire dans votre esprit et dites pourquoi vous l'avez peut-être cette erreur. Peut-être que vous avez un peu de javascript erreur quelque part ou quelque chose.
    Je n'ai rien fait avec jscript que je suis au courant, ce qui a commencé comme un stock MVC4 VS générés par l'app. Il jette la même erreur même si je l'ai essayer pour faire défiler la zone de liste. - Je voir les éléments dans la boîte commencez à faire juste avant de VS pauses sur l'erreur.
    Plus tôt dans le cycle de vie de ce soft, j'avais été tenté de faire le Themeroller thèmes et apparemment loupé quelque chose en jScript. J'ai brûlé à la terre et a commencé à nettoyer et à votre solution fonctionne très bien. Merci!
    Quand j'essaie d'imiter cela, mes membres de la posté modèle sont null - ie modèle.SelectedFeatures est null. Mais, quand je regarde à la Demande.Params - tous SelectedFeatures sont restitués. Pourquoi ne seraient-ils pas dans mon modèle?

    OriginalL'auteur Darin Dimitrov