Grosse différence de code après requête ajax
Bonjour.
Pour mon appli, sur une page, j'ai un select (fait avec Struts2).
Afin de pouvoir faire une "mise à jour" du select suite envoi de données dans la base, celui-ci est dans une jsp différente (donc include dans la page).
Dans mon code de ma JSP, j'ai
Code:
1
2
3
| <div id="select_employe" class="hidden col-md-3 input-group">
<s:include value="/WEB-INF/views/resultaddemploye.jsp"/>
</div> |
Et la page include :
Code:
1
2
3
4
5
6
7
8
9
10
| <%@ taglib uri="/struts-tags" prefix="s"%>
<s:if test="employes != null">
<!-- --------------------------------------------------- Select Employés --------------------------------------------------- -->
<s:select class="form-control" list="employes" name="idEmploye" listKey="idEmploye" listValue="%{nomEmploye + ' ' + prenomEmploye}" value="idEmploye" id="selectEmploye" emptyOption="true" required="required"/>
<!-- ------------------------------------------------------------------------------------------------------------------------- -->
</s:if>
<s:else>
<select class="form-control"></select>
</s:else>
<span class="input-group-addon" id="basic-addon-client" data-toggle="tooltip" title="Ajouter un nouvel employe"><span class="glyphicon glyphicon-plus-sign" id="ajout-client" aria-hidden="true" data-toggle="modal" data-target="#modal-ajout"></span></span> |
Au chargement de la page et actualisation de celle-ci, voici le code que j'obtiens sur mon navigateur :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| <div id="select_employe" class="hidden col-md-3 input-group">
<!-- --------------------------------------------------- Select Employés --------------------------------------------------- -->
<select name="idEmploye" id="selectEmploye" class="form-control" required="required">
<option value=""></option>
<option value="14">NEMARRE Jean</option>
<option value="15">MACHIN Bidule</option>
<option value="16">TRUC Muche</option>
<option value="17">TITI Toto</option>
<option value="18">DUPOND Pierre</option>
<option value="19">AZERTY Uiop</option>
<option value="20">QSDFG Hjklm</option>
<option value="21">WXCV Bn</option>
</select>
<!-- ------------------------------------------------------------------------------------------------------------------------- -->
<span class="input-group-addon" id="basic-addon-client" data-toggle="tooltip" title="Ajouter un nouvel employe"><span class="glyphicon glyphicon-plus-sign" id="ajout-client" aria-hidden="true" data-toggle="modal" data-target="#modal-ajout"></span></span>
</div> |
Mais après avoir saisi de nouvelle info via une modal et envoi des infos via requête ajax, ma base se met à jour et mon select aussi.
Voici le nouveau code html de mon navigateur après "mise à jour" de la div :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| <div id="select_employe" class="col-md-3 input-group">
<!-- --------------------------------------------------- Select Employés --------------------------------------------------- -->
<tr>
<td class="tdLabel"></td>
<td class="tdInput">
<select name="idEmploye" id="selectEmploye" class="form-control" required="required">
<option value=""></option>
<option value="14">NEMARRE Jean</option>
<option value="15">MACHIN Bidule</option>
<option value="16">TRUC Muche</option>
<option value="17">TITI Toto</option>
<option value="18">DUPOND Pierre</option>
<option value="19">AZERTY Uiop</option>
<option value="20">QSDFG Hjklm</option>
<option value="21">WXCV Bn</option>
<option value="22">TATA Titi</option>
</select>
</td>
</tr>
<!-- ------------------------------------------------------------------------------------------------------------------------- -->
</div> |
Pourquoi, j'ai maintenant un tableau et ma span avant la fermeture de la dive à disparue ?? :marteau::marteau::marteau::marteau:
Je pense pas que se soit utile si vous voulez, je vous donne le js de la requête ajax :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
| $('#btn_save').on('click', function(){ $.ajax({
url : 'addEmploye',
type: 'POST',
data : {nomEmploye : $('#nom_employe').val(), prenomEmploye : $('#prenom_employe').val()},
dataType : 'html',
success : function(html){
$('#select_employe').html(html);
},
error : function(xhr, ajaxOptions, thrownError){
alert('Un probléme est survenu ! ' + thrownError);
}
})
}) |
Soyons fou, je vous donne même l'action correspondante du fichier struts.xml :
Code:
1
2
3
| <action name = "addEmploye" class="sii.dsi.action.TempsTravailAction" method="AddEmploye">
<result name="success">/WEB-INF/views/resultaddemploye.jsp</result>
</action> |
et même la méthode qui traite les données coté Java :
Code:
1
2
3
4
5
6
7
8
| public String AddEmploye() { Employe employe = new Employe();
DAO<Employe> employeDao = DAOFactory.getEmployeDao();
employe.setNomEmploye(nomEmploye);
employe.setPrenomEmploye(prenomEmploye);
employeDao.create(employe);
employes = employeDao.findAll();
return "success";
} |
Une idée de comment ne pas avoir cette différence de code et avoir le code que j'ai au chargement de la page ??
Merci d'avance pour votre aide.
