Discussion :

[Naruto_kun]

BOnjour,

je souhaiterais ouvrir une vue dans une fenetre modal.
Je m'explique, j'ai un premiere ecran de recherche qui me permet de saisir 2 filtres (Date et numero).
Je voudrais lorsque je clic sur le boutont rechercher aller sur mon controller afin de vérifier la saisie des 2 filtres et ensuite ouvrir une vue dans une fenetre modal tout en restant sur le même écran.
Pourriez vous m'aiguiller svp sur comment procéder et avancer sur ce point ?
Cela fait 2 jours que je suis bloqué dessus sans trop avancer.

Merci

[katkiller]

Salut,

Est ce que tu pourrais nous mettre un peu de code ?
Quelle techno utilises tu coté client ? (JQuery,...)

[Naruto_kun]

Voici ma page de recherche

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
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
 
 
@{
    ViewBag.Title = RTVS.SearchByTree;
    Layout = "~/Views/Shared/_Layout.cshtml";
}
 
 
@model ByTreeViewModel
 
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/jquery-ui-1.8.24.min.js"></script>
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />
 
@section scripts {
<script type="text/javascript">
    $(document).ready(function () {
 
 
 
        $('.RadioBtn').live("click", function () {
            ClearOldValue();
            if ($(this).attr("value") == '@EnumTST.ByDateFab_NumLot') {
                //alert('numlot');
                $(".ByBarCode").hide();
                $(".ByDateNumLot").show();
            }
            if ($(this).attr("value") == '@EnumTST.ByBarCode') {
                $(".ByDateNumLot").hide();
                $(".ByBarCode").show();
            }
        });
 
        function ClearOldValue() {
            // On remplace la classe de l'element en erreur par une class valide
            $('.field-validation-error').each(function () {
                $(this).removeClass('field-validation-error').addClass('field-validation-valid');
            });
            // On remplace la classe de l'element en erreur par une class valide
            $('.input-validation-error').each(function () {
                $(this).val('');
                $(this).removeClass('input-validation-error').addClass('input-validation-valid');
            });
        }
 
 
 
        var valTypeSearch = $('input[name=TypeSearch]:checked', '#SearchForm').val();
 
        if (valTypeSearch == '@EnumTST.ByBarCode') {
            $(".ByDateNumLot").hide();
            $(".ByBarCode").show();
        }
 
        if (valTypeSearch == '@EnumTST.ByDateFab_NumLot') {
            $(".ByBarCode").hide();
            $(".ByDateNumLot").show();
        }
 
 
        var valViewBag = '@ViewBag.LstPrimaire';
        alert(valViewBag);
        if (valViewBag == 'Open') {
 
 
            url = url + "?dateFab=" + d + "&numLot=" + n;
            alert(url);
            $("#dialog-detail").dialog(
                    {
 
                        title: 'Liste Composant primaire',
                        autoOpen: false,
                        resizable: false,
                        width: 400,
                        show: { effect: 'drop', direction: "up" },
                        modal: true,
                        draggable: true,
                        open: function (event, ui) {
                            $(".ui-dialog-titlebar-close").hide();
                            $(this).load(url);
                        },
                        buttons: {
                            "Close": function () {
                                $(this).dialog("close");
                            }
                        }
                    });
 
 
 
            $("#dialog-detail").dialog('open');
        }
 
    });
 
 
 
 
 
//    $("#btnSearch").live("click", function (e) {
 
//        var form = $("#SearchForm");
//        var urlac = form.attr("action");
//        alert(urlac);
//        var formdata = form.serialize();
//        $.post(urlac, formdata, function (data) {
//         //   alert('ok');
//         //   $("#dialog-detail").dialog('open');
//        });
//        return false;
//    });
 
</script>
}
 
 
<div id="dialog-detail" style="display: none">
</div>
 
 
 
<div>@Html.ValidationMessage("CustomValidation")</div>
@using (Html.BeginForm("SubmitSearchByTree", "Search", FormMethod.Post, new { id = "SearchForm" }))
{
    @Html.ValidationSummary(true)
    <div>
        @Html.Label(RTVS.TypeSearchByTree)
        <br />
            <b>
            @Html.RadioButtonFor(m => m.TypeSearch, EnumTST.ByDateFab_NumLot, new { @class = "RadioBtn" }) @EnumTST.ByDateFab_NumLot.GetDescription()
             </b>
        @Html.Raw("&nbsp")
        <b>
        @Html.RadioButtonFor(m => m.TypeSearch, EnumTST.ByBarCode, new { @class = "RadioBtn" }) @EnumTST.ByBarCode.GetDescription()
        </b>
 
        <br />
         <br />
 
 
        <div class="ByDateNumLot">
            @Html.LabelFor(m => m.SearchDate) 
            @Html.TextBoxFor(m => m.SearchDate, new { @maxlength = "10", @class = "DatePicker" }) 
            @Html.ValidationMessageFor(m => m.SearchDate)
 
            @Html.LabelFor(m => m.NumLot) 
            @Html.TextBoxFor(m => m.NumLot, new { @maxlength = "3", @style = "width:40px;" })
            @Html.ValidationMessageFor(m => m.NumLot)
            <br />
                <br />
 
        </div>
 
            <div class="ByBarCode">
            @Html.LabelFor(m => m.BarCode) 
            @Html.TextBoxFor(m => m.BarCode, new { @maxlength = "10" }) 
            @Html.ValidationMessageFor(m => m.BarCode)
            <br />
                <br />
 
        </div>
 
    </div>
 
    <button type="submit"  id="btnSearch" name="SubmitButton" value="Save">@RTVS.BtnSearch</button>
 
}

voici mon controller

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
 
/// <summary>
        /// Ecran de rechercher par Arborescence 
        /// </summary>
        /// <returns></returns>
        public ActionResult ByTree()
        {
            ViewBag.LstPrimaire = "NoOpen";
            return View(new ByTreeViewModel() { TypeSearch = TreeSearchType.ByDateFab_NumLot, OpenLstPrimaire = false});
        }
 
        [HttpPost]
        public ActionResult SubmitSearchByTree(ByTreeViewModel vm)
        {
            //Verif que la recherche est valide (Voir DataAnnotations sur ViewModel)
            if (!ModelState.IsValid)
            {
                return View("ByTree", vm);
            }
 
            if (vm.TypeSearch == TreeSearchType.ByDateFab_NumLot)
            {
                ViewBag.LstPrimaire = "Open";
                return View("ByTree", vm);
 
            }
            //Redirection vers la page de saisie d'informations
            return RedirectToAction("ListComposant", "Composant", new { cb = vm.BarCode });
        }
 
 
public ActionResult ListComposantPrimaire(DateTime dateFab, int numLot)
        {
            ListComposantPrimaireViewModel lcp = new ListComposantPrimaireViewModel();
            lcp.DateFabrication = dateFab;
            lcp.NumeroLot = numLot;
 
            return View(lcp);
 
        }

Pour finir la vue que je souhaiterais afficher en popup modal sur mon ecran de recherche

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
 
 
@model ListComposantPrimaireViewModel
 
<div>
<h2>@Model.NumeroLot</h2>
<h2>@Model.DateFabrication</h2>
</div>

C'est un peu le bordel mais je m'en excuse. Franchement je n'en peux plus. Je construit mon lien pour ma popup mais il ne passe pas par l'action ListComposantPrimaire de mon controller.
Pour infos je suis debutant en javascript et jquery.

Merci

[Softcadbury]

Hello, hélas je n'ai pas mon Visual Studio pour tester mais en regardant le code il y a déjà une ligne que je trouve étrange.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

url = url + "?dateFab=" + d + "&numLot=" + n;

Tu utilises la variable url qui n'est jamais déclarée avant du coup ta vue ne risque pas d'être chargée.

[Naruto_kun]

salut,

finalement je fais différemment. Je charge la pop-up modal dans ma page de base et non vers une autre vue.
Cela fonctionne très bien .

Merci