Publicité
+ Répondre à la discussion
Affichage des résultats 1 à 4 sur 4
  1. #1
    Futur Membre du Club
    Homme Profil pro Cyril
    Développeur Informatique en Alternance
    Inscrit en
    mai 2012
    Messages
    43
    Détails du profil
    Informations personnelles :
    Nom : Homme Cyril
    Localisation : France, Loire Atlantique (Pays de la Loire)

    Informations professionnelles :
    Activité : Développeur Informatique en Alternance
    Secteur : Service public

    Informations forums :
    Inscription : mai 2012
    Messages : 43
    Points : 18
    Points
    18

    Par défaut MVC3 Cascading DropDownList

    Salut,

    Dans mon appli', j'ai une page d'analyse qui sert à afficher les logs de différentes applis, on m'a donc demandé de réaliser des listes déroulantes permettant d'afficher selon certains critères cette page de Logs.

    Le problème, c'est que j'ai deux listes déroulantes :
    1. la première qui sert à choisir l'application
    2. et la deuxième qui me sert à choisir la période d'affichage des logs pour l'appli sélectionnée.


    Et c'est sur le deuxième point que je bloque, chaque application possède des types de périodes différentes, par exemple l'application 1 aura des logs mensuels, dans la liste, j'aurais donc : Janvier 2012, Février 2012, etc... tandis que l'application 2 aura des logs journaliers, mensuels et semestriels mais j'ai un peu de mal à voir comment le faire.

    J'ai fait quelques recherches et j'ai pu voir qu'il fallait utiliser du Javascript mais je ne suis pas du tout calé dans ce langage, j'ai essayé un script que j'ai récupéré sur un site mais bon, il ne fonctionne pas ;D

    Le voici avec mes listes dans ma vue :
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
     
    @using (Html.BeginForm("PageErreurs", "Suivi", new { Timing = "KO" }))
            {
                @Html.ListBox("SubCR", ViewBag.Liste1 as MultiSelectList, new { size = 5 })
     
                <script type="text/javascript">
                    $(function () {
                        $("SubAppli").change(function (evt) {
     
                            if ($("SubAppli").val() != "-1") {
     
                                $.ajax({
                                    url: "/Suivi/PageErreurs",
                                    type: 'POST',
                                    data: { ChoixAppli: $("SubAppli").val() },
                                    success: function (response) {
                                        $("SubPeriode").replaceWith(response)
                                    },
                                    error: function (xhr) {
                                        alert("Erreur au niveau des listes et du JS !");
                                    }
                                });
                            }
                        });
                    });
                </script>
     
                @Html.ListBox("SubAppli", ViewBag.Liste2 as MultiSelectList)
     
                @Html.ListBox("SubPeriode", ViewBag.Liste3 as MultiSelectList)      
     
                <input id="Submit1" type="submit" value="Valider" class="bt_submit"/>
            }
    Et je récupère la variable qui est normalement renvoyée à mon action afin d'afficher ce que je souhaite et récupérée par celle-ci :
    Code :
    1
    2
     
    public ActionResult PageErreurs(string Timing, string[] SubCR, string[] SubAppli, string ChoixAppli)
    Et ensuite, j'utilise le contenu de cette variable pour alimenter ma liste en fonction de celle-ci avec une requête.

    J'ai essayé d'exécuter ce script mais rien à faire, il ne se passe rien :/

    Avez-vous une idée ?

    Merci.

    P.S : Si jamais, j'ai besoin d'installer des packages ou autres, ce n'est pas possible, l'accès Internet est bloqué sur mon serveur de Dev'.

  2. #2
    Futur Membre du Club
    Homme Profil pro Cyril
    Développeur Informatique en Alternance
    Inscrit en
    mai 2012
    Messages
    43
    Détails du profil
    Informations personnelles :
    Nom : Homme Cyril
    Localisation : France, Loire Atlantique (Pays de la Loire)

    Informations professionnelles :
    Activité : Développeur Informatique en Alternance
    Secteur : Service public

    Informations forums :
    Inscription : mai 2012
    Messages : 43
    Points : 18
    Points
    18

    Par défaut

    Bon j'ai un peu avancé sur mon soucis (à vrai dire pendant toute la journée mais bon...) et au moins, un truc se passe sur mon écran ...

    Lorsque je sélectionne une valeur dans ma liste, la liste qui doit contenir des données en fonction de la valeur choisie par la première liste m'affiche une liste immense de blanc alors que normalement elle devrait contenir moins d'une dizaine de valeurs et ça commence à me prendre le choux

    Voici le script que j'utilise :
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
     
                <script>
                    $(document).ready(function () {
                        $("#SubAppli").change(function () {
                            $.ajax({
                                url: "/Suivi/PageErreurs/",
                                type: 'POST',
                                data: { ChoixAppli: $(this).val() },
                                datatype: 'json',
                                success: function (data) {
                                    var elements = "";
                                    $.each(data, function () {
                                        elements = elements + '<option value="' + this.ListePeriode + '">'
                                    })
                                    $('#SubPeriode').empty().attr('disabled', false).append(elements);
                                }
                            });
                        });
                    });
     
                </script>
    SubAppli correspond à ma première Liste comme indiquée sur mon premier post et SubPeriode à ma deuxième.

    Voici les quelques parties de mon action qui je pense sont les plus intéressantes.

    Alimentation des listes déroulantes, la première concernant les Applications :
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
     
    var itemsAppli = GetAppli();
                var queryAppli = (from i in itemsAppli
                                  select new Suivi { CD_APPLI = i.Field<String>("CD_APPLI") }).ToList();
     
                List<string> ListeAppli = new List<string>();
     
                foreach (var recup in queryAppli)
                {
                    ListeAppli.Add(recup.CD_APPLI);
                }
     
     
                MultiSelectList Liste2 = new MultiSelectList(ListeAppli, "CD_APPLI");
     
                ViewBag.Liste2 = Liste2;
    Et la deuxième où je récupère les périodes sous le format "20121101" (dans la base en bigint) que je transforme avec mes conditions en leur valeur Texte :
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
     
    var QueryDate = (from i in itemsDate
                                     where i.Field<String>("CD_APPLI").Trim() == ChoixAppli.Trim()
                                     select new Suivi { PERIODE = i.Field<Int64>("PERIODE") }).ToList();
     
                    List<string> ListePeriode = new List<string>();
                    if (QueryDate.Count == 0)
                    {
                        ListePeriode.Add("Aucunes dates");
                    }
                    else
                    {
                        //Boucle parcourant le résultat de la requête précédente.
                        foreach (var resultat in QueryDate)
                        {
                            //Opérations sur le résultat afin de le découper en 2 morceaux pour effectuer la translation chiffres/lettres (ex:01 => Janvier).
                            string RecupDate = resultat.PERIODE.ToString();
                            string RecupAnnee = RecupDate.Substring(0, 4);
                            string RecupMois = RecupDate.Substring(4, 2);
     
                            //Série de conditions sur les valeurs récupérées dans RecupMois.
                            if (RecupMois == "01")
                            {
                                if (ListePeriode.Contains("Janvier " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    //La valeur est ajoutée dans la liste avec l'année récupérée plus haut.
                                    ListePeriode.Add("Janvier " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "02")
                            {
                                if (ListePeriode.Contains("Février " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Février " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "03")
                            {
                                if (ListePeriode.Contains("Mars " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Mars " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "04")
                            {
                                if (ListePeriode.Contains("Avril " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Avril " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "05")
                            {
                                if (ListePeriode.Contains("Mai " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Mai " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "06")
                            {
                                if (ListePeriode.Contains("Juin " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Juin " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "07")
                            {
                                if (ListePeriode.Contains("Juillet " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Juillet " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "08")
                            {
                                if (ListePeriode.Contains("Aout " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Aout " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "09")
                            {
                                if (ListePeriode.Contains("Septembre " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Septembre " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "10")
                            {
                                if (ListePeriode.Contains("Octobre " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Octobre " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "11")
                            {
                                if (ListePeriode.Contains("Novembre " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Novembre " + RecupAnnee);
                                }
                            }
                            else if (RecupMois == "12")
                            {
                                if (ListePeriode.Contains("Décembre " + RecupAnnee))
                                {
                                    //Rien n'est ajouté dans la liste.
                                }
                                else
                                {
                                    ListePeriode.Add("Décembre " + RecupAnnee);
                                }
                            }
                        }
                    }
     
                    MultiSelectList Liste3 = new MultiSelectList(ListePeriode, "PERIODE");
     
                    ViewBag.Liste3 = Liste3;
    Cette action s'appelle "PageErreurs" dans le contrôleur "Suivi".

    Voilà, si jamais vous voulez d'autres informations, code ou autres, signalez le moi.

    Merci d'avances pour vos réponses, en espérant qu'il y en ait

  3. #3
    Futur Membre du Club
    Homme Profil pro Cyril
    Développeur Informatique en Alternance
    Inscrit en
    mai 2012
    Messages
    43
    Détails du profil
    Informations personnelles :
    Nom : Homme Cyril
    Localisation : France, Loire Atlantique (Pays de la Loire)

    Informations professionnelles :
    Activité : Développeur Informatique en Alternance
    Secteur : Service public

    Informations forums :
    Inscription : mai 2012
    Messages : 43
    Points : 18
    Points
    18

    Par défaut

    Je reviens sur ce problème et vous demande juste une dernière fois après je vous laisserais tranquille...avez-vous une idée pour résoudre mon soucis ?

  4. #4
    Futur Membre du Club
    Homme Profil pro Cyril
    Développeur Informatique en Alternance
    Inscrit en
    mai 2012
    Messages
    43
    Détails du profil
    Informations personnelles :
    Nom : Homme Cyril
    Localisation : France, Loire Atlantique (Pays de la Loire)

    Informations professionnelles :
    Activité : Développeur Informatique en Alternance
    Secteur : Service public

    Informations forums :
    Inscription : mai 2012
    Messages : 43
    Points : 18
    Points
    18

    Par défaut

    J'ai trouvé la solution pour mes listes, j'vais faire court, voici mon modèle de vue :
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
     
    public class ClasseListesDeroulantes
        {
            public string APPLI { get; set; }
            public string CAISSE { get; set; }
            public Int64? PERIODE { get; set; }
     
            Requetes rq = new Requetes();
            string requeteAppli = "select distinct CD_APPLI, ORDRE_APPLI from dbo.REF_APPLI where CD_APPLI != 'PNB' order by ORDRE_APPLI";
            string requeteCR = "select distinct CD_CR, LB_CR from dbo.REF_CR";
     
            public IEnumerable<SelectListItem> Applis
            {
                get
                {
                    var itemsAppli = rq.executerRequete(requeteAppli);
                    var queryAppli = (from i in itemsAppli
                                      select new SelectListItem { Value = i.Field<String>("CD_APPLI").ToString(),
                                                                Text = i.Field<String>("CD_APPLI").ToString() });
     
                    return queryAppli.AsEnumerable();
                }
            }
     
            public IEnumerable<SelectListItem> Caisses
            {
                get
                {
                    var itemsCR = rq.executerRequete(requeteCR);
                    var queryCR = (from i in itemsCR
                                    select new SelectListItem
                                    {
                                        Value = i.Field<String>("CD_CR").ToString(),
                                        Text = i.Field<String>("LB_CR").ToString()
                                    });
     
                    return queryCR.AsEnumerable();
                }
            }
        }
    Mes actions :
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
     
    public ActionResult PageTests(string PERIODE)
            {
                var DDL = new ClasseListesDeroulantes();
     
                if (PERIODE != null || PERIODE != "")
                {
                    ViewData["ResPeriode"] = PERIODE;
                }
     
                return View(DDL);
            }
     
            public ActionResult Periode(string appli)
            {
                var itemsDate = rq.executerRequete(requetePERIODE2);
                //Récupération des différentes périodes en fonction de la CR dans une liste.
                var queryPeriode = (from i in itemsDate
                                   where i.Field<String>("CD_APPLI").Trim() == appli.Trim()
                                   select new ClasseListesDeroulantes { PERIODE = i.Field<Int64>("PERIODE")}).ToList();
     
                List<string> ListePeriode = new List<string>();
                #region Boucle d'ajout d'éléments dans la liste ListePeriode
                //Boucle parcourant le résultat de la requête précédente.
                foreach (var resultat in queryPeriode)
                {
                    //Opérations sur le résultat afin de le découper en 2 morceaux pour effectuer la translation chiffres/lettres (ex:01 => Janvier).
                    string RecupDate = resultat.PERIODE.ToString();
                    string RecupAnnee = RecupDate.Substring(0, 4);
                    string RecupMois = RecupDate.Substring(4, 2);
     
                    //Série de conditions sur les valeurs récupérées dans RecupMois.
                    if (RecupMois == "01")
                    {
                        if (ListePeriode.Contains("Janvier " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            //La valeur est ajoutée dans la liste avec l'année récupérée plus haut.
                            ListePeriode.Add("Janvier " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "02")
                    {
                        if (ListePeriode.Contains("Février " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Février " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "03")
                    {
                        if (ListePeriode.Contains("Mars " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Mars " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "04")
                    {
                        if (ListePeriode.Contains("Avril " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Avril " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "05")
                    {
                        if (ListePeriode.Contains("Mai " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Mai " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "06")
                    {
                        if (ListePeriode.Contains("Juin " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Juin " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "07")
                    {
                        if (ListePeriode.Contains("Juillet " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Juillet " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "08")
                    {
                        if (ListePeriode.Contains("Aout " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Aout " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "09")
                    {
                        if (ListePeriode.Contains("Septembre " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Septembre " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "10")
                    {
                        if (ListePeriode.Contains("Octobre " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Octobre " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "11")
                    {
                        if (ListePeriode.Contains("Novembre " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Novembre " + RecupAnnee);
                        }
                    }
                    else if (RecupMois == "12")
                    {
                        if (ListePeriode.Contains("Décembre " + RecupAnnee))
                        {
                            //Rien n'est ajouté dans la liste.
                        }
                        else
                        {
                            ListePeriode.Add("Décembre " + RecupAnnee);
                        }
                    }
                }
                #endregion
     
                List<SelectListItem> periode = new List<SelectListItem>();
                int compteur = 0;
                foreach (var resultat in queryPeriode)
                {
                    periode.Add(new SelectListItem
                                {
                                    Text = ListePeriode.ElementAt(compteur),
                                    Value = resultat.PERIODE.ToString()
                                });
                    compteur++;
                }
     
                return Json(periode.AsEnumerable(), JsonRequestBehavior.AllowGet);
            }
    Et ma vue :
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
     
    @using (Html.BeginForm("PageTests", "Suivi"))
    {
        @Html.DropDownListFor(
            x => x.CAISSE,
            new MultiSelectList(Model.Caisses, "Value", "Text"),
            "-- Caisses Régionales --"
        )
     
        @Html.DropDownListFor(
            x => x.APPLI,
            new SelectList(Model.Applis, "Value", "Text"),
            "-- Application --"
        )
     
        @Html.DropDownListFor(
            x => x.PERIODE,
            Enumerable.Empty<SelectListItem>(),
            "-- Période --"
        )
     
        <input id="Submit1" type="submit" value="Valider" class="bt_submit"/>    
    }
     
    <script type="text/javascript">
        $(document).ready(function(){
            $('#APPLI').change(function () {
                var selAppli = $(this).val();
                if (selAppli != null && selAppli != '') {
                    $.getJSON('@Url.Action("Periode")', { appli: selAppli }, function (periodes) {
                        var selPeriode = $('#PERIODE');
                        selPeriode.empty();
                        $.each(periodes, function (index, periode) {
                            selPeriode.append($('<option/>', {
                                value: periode.Value,
                                text: periode.Text
                            }));
                        });
                    });
                }
            });
        });
    </script>
    J'ai quelques morceaux de codes en plus qui ne servent pas encore pour l'instant et j'ai aussi rajouté une liste déroulante, mais celles concernées par le script sont les listes pour les Applis et les Périodes.

+ Répondre à la discussion
Cette discussion est résolue.

Liens sociaux

Règles de messages

  • Vous ne pouvez pas créer de nouvelles discussions
  • Vous ne pouvez pas envoyer des réponses
  • Vous ne pouvez pas envoyer des pièces jointes
  • Vous ne pouvez pas modifier vos messages
  •