Bonjour ,
Je me vois bloque sur un detail : apres avoir afficher la liste des elements , voila une fentre modale qui doit s ouvrir et charger le detail d un element dans le modale .
Je suis toujours bloque apres avoir chercher des solution , donc votre aide pour que j'avance .
Voila le controleur :
Voici la liste de l'info et le lien qui doit déclencher le modale, et le modale en bas
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6 @RequestMapping(value = "/GetEvenDetailOnModal/{id}" , method = RequestMethod.GET) public @ResponseBody Evenement GetEvenDetailOnModal(@PathVariable("id") long id) throws Exception { System.out.println("ID EVENT RECUPERE:::::------:::::"+id); Evenement evenementDetail = this.eventService.findById(id); return evenementDetail; }
Code JSP : 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 <c:if test="${!empty listEvenements}"> <table id="listEvenementEvt" class="table table-striped table-bordered" cellspacing="0" width="100%"> <thead class=" "> <th>NomEt</th> <th>Date</th> <th>NomNe</th> <th>Genre</th> <th>Im</th> <th>Assure</th> <th colspan="1" width="85">Gestion</th> </tr> </thead> <tfoot class="TitreAcceul"> <tr> <th>NomEt</th> <th>Date</th> <th>NomNe</th> <th>Genre</th> <th>Im</th> <th>Assure</th> <th colspan="1" width="85">Gestion </th> </tr> </tfoot> <c:forEach items="${listEvenements}" var="event"> <tr class=" "> <td>${event.nom}</td> <td>${event.date}</td> <td>${event.nomNa}</td> <td>${event.genr.nomGe}</td> <td>${event.imm}</td> <td>${event.arra}</td> <td> <a href=" " class="infoEvenModale" data-toggle="modal" data-target="#validInvalidModal" data-idev='${event.id}'><span class="fas fa-edit" title="ValidationInvalidation"></span></a> </td> </tr> <!-- VAlideInvalide Modal-----------------------------------------------------------> <div class="modal fade" id="validInvalidModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog modal-lg" role="document"> <div class="modal-content"> <div class="modal-header btn btn-primary"> <h5 class="modal-title" id="exampleModalLabel"><i class="fas fa-check"></i> Validation </h5> <button class="close" type="button" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true"><p>x</p></span> </button> </div> <div class="modal-body"> <div class="card shadow mb-4"> <div class="card-header py-3"> <h6 class="m-0 font-weight-bold text-primary"><i class="fas fa-ship"></i> mis en entente de l'information : </h6> </div> <div class="card-body"> <c:url var="userCreate" value="${contextPath}/UserEyesCreate" ></c:url> <form:form class="form-horizontal" method="POST" modelAttribute="eventViewMajEatInfoCco" action="${eventCreate}" > <div class="form-group"> <label for="exampleFormControlInput1" class="control-label TitreAcceul">Etat validation agent : </label> <form:input path="etatEvenement" type="text" class="form-control bg-light border-1 small TitreAcceul" id="etatEvenement" value=" " /> </div> </div> </div> </div> <div class="modal-footer"> <p align="center" > <button type="submit" class="d-none d-sm-inline-block btn btn-sm-3 btn-primary shadow-sm"><span class="fas fa-check"></span> Validez</button> <button class="btn btn-secondary" type="button" data-dismiss="modal">Fermer</button> </form:form> </div> </div> </div> </div> <!-- VAlideInvalide Modal---------------------------------------------------------------------------------------> </c:forEach> </table> </c:if>
Voici le ficher js
Code JavaScript : 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 $(document).ready(function () { $("#validInvalidModal").on("show.bs.modal", function(e) { var evid = $(this).attr('data-idev'); var parent = $(this).parent("td").parent("tr"); alert(evid); $.ajax({ type: 'GET', // envoi des données en GET ou POST contentType: "application/json", url: '/GetEvenDetailOnModal/'+evid, //data: JSON.stringify(json), dataType: 'json', cache: false, timeout : 600000, success: function (data) { console.log("Success:",data); //---------------------------------------------------- //$("#etatEvenement").val(data.etatEvenement); $("#etatEvenement").html(data.etatEvenement); //$("#validInvalidModal").modale("show"); //---------------------------------------------------- }, error: function(e){ console.log("err!:", +e); } }); //} }); });
Merci Merci
Partager