Discussion :

[kaoutartahir]

Je développe une application web pour la recherche des médias, donc pour mon interface de recherche, je devrais avoir quelque chose comme ça: l'utilisateur peut spécifier les 4 champs et il peut aussi ajouter des autres critères de recherche en cliquant sur l'icône plus, je l'ai fait avec jquery, voir l'image ci-dessous:

Mais mon problème est que: Comment puis-je transmettre la liste des valeurs de formulaire à mon action !! je vous met ici le code de mon contrôleur et ma vue (je le fais juste pour la première ).
Contrôleur:

Code :

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
18
19
20
21
22
23
24
25
26
27
28
29
30
[HttpPost]
        public ActionResult RechercheForm(Recherche FormData)
        {
 
            List<Asset> liste = null;
 
 
            if (FormData.Op == "Like")
            {
                if (FormData.Critere == "Titre")
                {
                    liste = bdd.Assets.Where(a => (a.Titre.Contains(FormData.Val1)
                                                               )).ToList();
            ViewBag.Val = FormData.Val1;
                    return View("Index",liste);
                }
                else
                    if (FormData.Critere == "TitreCourt")
                    {
                         liste = bdd.Assets.Where(a => (a.TitreCourt.Contains(FormData.Val1)
                                                                   )).ToList();
                        return View("Index", liste);
                    }
 
            }
            return View("Index");
 
 
 
        }

Ma vue:

Code :

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
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
<div class="right-content" style="width: 760px;" >
                   <!-- DropListDownData -->
                @{
 
 
                    Dictionary<string, string> ListCritere=new Dictionary<string, string>
                        {
                            {"Titre", "Titre"},
                            {"TitreCourt", "TitreCourt"},
 
                            // some lines skipped
                        };
                    Dictionary<string, string> ListOp = new Dictionary<string, string>
                        {
                            {"Like", "Like"},
                            {"Sup", "Sup"},
                            {"Inf", "Inf"},
 
                            // some lines skipped
                        };
 
 
 
 
                    }
 
 
 
 
 
 
 
 
                        @using (Html.BeginForm("RechercheForm", "Recherche",new { ReturnUrl = ViewBag.ReturnUrl },FormMethod.Post, new { @class = "form-inline" })){
                            <button type="submit" class="btn btn-default">Rechecrcher</button>
                            <table id="TableRech">
                              <tr>
                                <th>Critere</th>
                                <th>Opérateur</th>
                                <th>Valeur1</th>
                                <th>Valeur2</th>
                                <th></th>
 
                              </tr>
                              <tr>
                                <td><div class="form-group">
                              @Html.DropDownList("Critere", new SelectList(ListCritere, "Key", "Value"),new { @class = "form-control" })
 
                          </div></td>
                                <td><div class="form-group">
 
                               @Html.DropDownList("Op", new SelectList(ListOp, "Key", "Value"),new { @class = "form-control" })
 
                          </div></td>
                                <td><div class="form-group">
 
                               @Html.TextBox("Val1",null,new {id = "Val2", @class = "textbox", style="width:50px;padding-right: 50px; " })
                          </div></td>
                                <td> <div class="form-group">
 
                              @Html.TextBox("Val2",null,new {id = "Val2", @class = "textbox", style="width:50px;padding-right: 50px; " })
 
                          </div></td>
                                  <td><span class="glyphicon glyphicon-plus-sign" id="Plus" style="width: 15px;" onclick="RechFunctionPlus()" ></span></td>
 
 
 
                              </tr>
 
                            </table>
                        }
   </div>
        </div>
<script>
  function RechFunctionPlus() {
 
         var table= document.getElementById('TableRech');
         var tr = document.createElement('tr');
         table.appendChild(tr);
         var td = document.createElement('td');
         td.innerHTML='<select class="form-control" id="Critere" name="State"> <!-- some attrs=ibutes skipped --><option value=""></option><option value="Titre">Titre</option><option value="TitreCourt">TitreCourt</option><option value="Type">Type</option></select>';
         tr.appendChild(td);
         var td2 = document.createElement('td');
         td2.innerHTML='<select class="form-control" id="Op" name="State"> <!-- some attrs=ibutes skipped --><option value=""></option><option value="Like">Like</option><option value="Inf">Inf</option><option value="Sup">Sup</option></select>';
 
         tr.appendChild(td2);
         var td3 = document.createElement('td');
         td3.innerHTML='@Html.TextBox("Val1",null,new {id = "Val1", @class = "textbox", style="width:50px;padding-right: 50px; " })';
         tr.appendChild(td3);
         var td4 = document.createElement('td');
         td4.innerHTML='@Html.TextBox("Val2",null,new {id = "Val2", @class = "textbox", style="width:50px;padding-right: 50px; " })';
         tr.appendChild(td4);
         var td5 = document.createElement('td');
         td5.innerHTML='<span class="glyphicon glyphicon-minus-sign" id="Plus" style="width: 15px;" onclick="RechFunctionMoins()" ></span>';
         tr.appendChild(td5);
 
     }
 </script>

J'ai pensé à faire une liste d'element de la classe Recherche(chaque linge du formulaire represente un element Recherche)que je vais passer a mon ActionForm,mais je sai pas comment!!

[mermich]

Salut,

Pour ce genre de fonctionnalite je passerai tout en json et ferai le parse ensuite cote serveur. Razor marche assez mal avec des elements dynamique sur une page.

Donc le plus simple lors du post, tu mets dans un hidden field la serialisation json de tous tes input et ensuite du brocles avec le json passe cote serveur.

[kaoutartahir]

Merci pour votre réponse .Est ce que vous pouvez me donner un exemple?

[shaun_the_sheep]

bonsoir,

ton concept m’intéresse pour mon projet actuel, peux tu me donner le nom de la lib jquery que tu as utiliser pour ton tableau ?
merci d'avance

[shaun_the_sheep]

Bonsoir,

jetes un coups d'oeil sur ce site tu y trouveras un bon exemple d'utilisation de tableau dynamique en mvc4
http://stackoverflow.com/questions/1...l-binding-work

l'idée est d'exploiter une liste dans ton modèle et de bien indexer tes champs

je l'ai mis partiellement en pratique pour mon cas d'usage (gestion d'une liste d'adresse)