IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

ASP.NET MVC Discussion :

Ajout d'élément dynamique dans la vue


Sujet :

ASP.NET MVC

  1. #1
    Membre habitué Avatar de touftouf57
    Profil pro
    Développeur .NET
    Inscrit en
    Décembre 2007
    Messages
    362
    Détails du profil
    Informations personnelles :
    Âge : 45
    Localisation : France, Moselle (Lorraine)

    Informations professionnelles :
    Activité : Développeur .NET
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2007
    Messages : 362
    Points : 174
    Points
    174
    Par défaut Ajout d'élément dynamique dans la vue
    Bonjour,

    Je suis différents tutoriels sur le web concernant ASP.Net MVC.
    En parallèle, je me suis fait un petit projet juste pour mettre cela en pratique.
    Ce petit projet serait de gérer des personnages de jeux de rôle.

    Donc un personnage possède différentes propriétés propres (race, nom, classe,.....).
    Maintenant, la ou cela se complique c'est concernant les compétences.
    Une compétence possède: un nom, un descriptif,..

    En base de données, cela nous donne 3 tables:
    Joueur(idJoueur (Identity), nom,....)
    Competence(idCompetence (identity), nom, descriptif,.....)
    CompetenceJoueur( idJoueur, idCompetence)

    La table CompetenceJoueur ne sert qu'a faire une liaison entre un joueur et une compétence. Bien entendu, un même joueur ne peut pas avoir 2 fois la même compétence, donc {IdCompetence, IdJoueur} est la clé primaire de cette table.

    Lorsque je créer un joueur, certes je remplis ces propriétés propres, mais pour les compétences je ne sais pas comment gérer le nombre variable de compétences.
    Un joueur peut en avoir 0 alors qu'un autre peut en avoir 5. C'est uniquement lorsque je valide le formulaire, via submit, que je crée tout en DB (enregistrement dans la table Joueur + enregistrements dans la table CompetenceJoueur).

    D'accord, je passe un ViewModel à ma vue pour qu'elle puisse avoir la collection des compétences qu'elle mettra dans une liste de choix, mais comment faites vous pour pouvoir afficher une nouvelle compétence à un joueur sans faire de Submit? Un peu comme on le ferait dans une grille Winforms, ou on aurait un bouton + (ajouter ligne competence).
    Je suppose que cela devrait plutôt se faire coté client (il n'y a pas besoin de contacter le serveur pour cela), donc dans du script, mais vous faite cela comment? Avec une vue partielle? autre chose?

    L'idée serait la même dans le cas d'une édition de joueur, dans le cas ou je me serais rendu compte que j'avais oublié de lui attribuer une compétence ou qu'il en aurait acquis une nouvelle grâce à ses différents faits d'armes.

    Je suis preneur de tout exemple, parce que les tutos que je suis sont plutôt simplistes de ce point de vue.

    Merci d'avance.

  2. #2
    Membre habitué Avatar de touftouf57
    Profil pro
    Développeur .NET
    Inscrit en
    Décembre 2007
    Messages
    362
    Détails du profil
    Informations personnelles :
    Âge : 45
    Localisation : France, Moselle (Lorraine)

    Informations professionnelles :
    Activité : Développeur .NET
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2007
    Messages : 362
    Points : 174
    Points
    174
    Par défaut
    Bonjour,

    Je suis surpris de ne pas avoir de réponse à cette question vu le nombre de vues.

    Est-ce que ma question n'est pas claire?
    Est-ce que c'est trop complexe?
    Est-ce que c'est tellement simple qu'il faudrait que je cherche mieux sur le web?

    Merci

  3. #3
    Modérateur
    Avatar de DotNetMatt
    Homme Profil pro
    CTO
    Inscrit en
    Février 2010
    Messages
    3 611
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 36
    Localisation : Etats-Unis

    Informations professionnelles :
    Activité : CTO
    Secteur : Finance

    Informations forums :
    Inscription : Février 2010
    Messages : 3 611
    Points : 9 743
    Points
    9 743
    Billets dans le blog
    3
    Par défaut
    Citation Envoyé par touftouf57 Voir le message
    Je suis surpris de ne pas avoir de réponse à cette question vu le nombre de vues.
    Il est probablement bon de rappeler que chacun visite le forum sur son temps libre, et donc chacun est libre de repondre ou non, comme il le souhaite !

    Citation Envoyé par touftouf57 Voir le message
    D'accord, je passe un ViewModel à ma vue pour qu'elle puisse avoir la collection des compétences qu'elle mettra dans une liste de choix, mais comment faites vous pour pouvoir afficher une nouvelle compétence à un joueur sans faire de Submit? Un peu comme on le ferait dans une grille Winforms, ou on aurait un bouton + (ajouter ligne competence).
    Je suppose que cela devrait plutôt se faire coté client (il n'y a pas besoin de contacter le serveur pour cela), donc dans du script, mais vous faite cela comment? Avec une vue partielle? autre chose?
    En general c'est un cas qui est assez chiant a gerer, ce qui explique probablement l'absence de reponse !

    Tu peux gerer ca cote client et/ou cote serveur.

    Cote client en jQuery par exemple. Tu peux soit avoir une sorte de template "statique" dans ton code JS, ou bien tu peux faire appel a une vue partielle a la demande pour te retourner le template. Le 2nd cas (appel a une vue partielle) est l'artillerie lourde, je dirais que ce n'est a utiliser que si tu as besoin de faire des traitements complexes (genre un appel a une DB / web service ou autre). Dans la plupart des cas un template statique avec un peu de logique JS suffit.

    A noter, il est possible d'utiliser des frameworks JS dynamiques tels que Angular, Backbone ou encore Knockout (il en existe d'autres). Mais ce n'est pas forcement une mince affaire....

    Un exemple simpliste avec jQuery : ASP.NET MVC: Proper model binding with dynamic form.

    Cote serveur, il existe par exemple la librairie FormFactory qui peut te permettre de generer le code HTML du formulaire dynamiquement. Dans ton cas, la solution cote serveur necessitera egalement du cote cote client, donc pas forcement ce que tu cherches.
    Less Is More
    Pensez à utiliser les boutons , et les balises code
    Desole pour l'absence d'accents, clavier US oblige
    Celui qui pense qu'un professionnel coute cher n'a aucune idee de ce que peut lui couter un incompetent.

  4. #4
    Membre habitué Avatar de touftouf57
    Profil pro
    Développeur .NET
    Inscrit en
    Décembre 2007
    Messages
    362
    Détails du profil
    Informations personnelles :
    Âge : 45
    Localisation : France, Moselle (Lorraine)

    Informations professionnelles :
    Activité : Développeur .NET
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2007
    Messages : 362
    Points : 174
    Points
    174
    Par défaut
    Bonjour,

    Mon dernier message n'était pas une attaque, ni une critique.
    Si cela a été pris de la sorte, je m'en excuse platement.

    Je me demandais si c'était moi qui avait mal formulé la question ou si j'avais très mal cherché sur le web.

    En tout cas, je te remercie dotNetMatt pour les différentes pistes. Je vais y jeter un oeil.

  5. #5
    Membre habitué Avatar de touftouf57
    Profil pro
    Développeur .NET
    Inscrit en
    Décembre 2007
    Messages
    362
    Détails du profil
    Informations personnelles :
    Âge : 45
    Localisation : France, Moselle (Lorraine)

    Informations professionnelles :
    Activité : Développeur .NET
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Décembre 2007
    Messages : 362
    Points : 174
    Points
    174
    Par défaut
    Je tiens à remercier DotNetMatt pour ces différents liens.

    Cela n'a pas été facile, mais j'y suis arrivé.
    Voici le code en place.

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
     
    <script type="text/javascript">
     
        $(document).ready(function () {
     
            $(".addRow").click(function () {
     
                var rowCount = $('.CompetenceRow').length;
                $("#tableauCompetences").append('<div class="CompetenceRow"><a href="javascript:void(0);" class="remRow">Supprimer</a><select name="Competences[' + rowCount + ']" class="CompetenceType">@foreach (Competence item in Model.SelectableCompetences){<option value="@item.Id">@item.Nom</option>}<a href="javascript:void(0);" class="remRow">Supprimer</a></div>');
            });
     
            $("#tableauCompetences").on('click', '.remRow', function () {
                $(this).closest('.CompetenceRow').remove();
            })
        });
     
    </script>

    Code CSHTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
     
    <div id="tableauCompetences">
                @for (int i = 0; i < Model.Competences.Count; i++)
                {
                    <div class="CompetenceRow">
                        <a href="javascript:void(0);" class="remRow">Supprimer</a>
                        @Html.DropDownListFor(o => o.Competences[i], new SelectList(Model.SelectableCompetences, "Id", "Nom", Model.Competences[i]))
                    </div>
                }
    </div>
    <a href="javascript:void(0);" class="addRow">Ajouter compétence</a>

    La difficulté que j'ai rencontré et qu'au départ j'avais tenté ceci:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    @Html.DropDownListFor(o => o.Competences[i], Model.SelectList))
    Bien que Model.SelectList soit une SelectList, lors de l'édition, je n'avais jamais l'item correspondant de sélectionner. Alors que si j'affichais la valeur de Model.Competences[i] correspondant, j'avais bien l'identifiant de compétence.
    En regardant le code Html généré, j'ai constaté qu'il n'y avais jamais de Selected sur les <Option>.

    J'ai cherché et j'ai trouvé ceci pour que ça fonctionne.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    new SelectList(Model.SelectableCompetences, "Id", "Nom", Model.Competences[i])
    Ou bien y a-t-il une autre solution moins tricky?

Discussions similaires

  1. [Débutant] Récupérer les données d'une table liée et les afficher dans une vue.
    Par Lotfiphp dans le forum ASP.NET MVC
    Réponses: 13
    Dernier message: 15/06/2018, 01h25
  2. Gestion de quotes imbriquées
    Par arthur57 dans le forum Langage
    Réponses: 5
    Dernier message: 26/01/2015, 16h00
  3. [AC-2010] Gestion du quote dans instruction SQL
    Par fclus dans le forum Requêtes et SQL.
    Réponses: 2
    Dernier message: 12/12/2013, 12h34
  4. gestion des quotes
    Par c+cool dans le forum Langage SQL
    Réponses: 6
    Dernier message: 12/08/2008, 09h51
  5. Réponses: 4
    Dernier message: 04/12/2006, 12h37

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo