Exécution javascript - Ajax - Chargement de la page
Bonjour/Bonsoir à tous,
J'ai une jsp contenant du javascript et de l'ajax (une histoire de drag & drop).
Un utilisateur doit choisir un nombre d'options définis (nous connaissons cette valeur). Pour choisir ces options nous avons une liste (ce mot, uniquement pour imager) A et il fait glisser ses options dans la liste B.
Une fois que ses choix sont fait, il valide (logique non ?).
Mon gros problème est que le javascript ne s’exécute pas au chargement de la page ! La première fois ... Si j'actualise la page et refait mes choix, le javascript fonctionne bien ! Je ne comprends vraiment pas pourquoi ... :?
Les scripts
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
| <script>
$(function() {
$( "ol.droptrue" ).sortable({
connectWith: "ol"
});
$( "#sortable1, #sortable2" ).disableSelection();
});
</script>
<script language="javascript">
jQuery(document).ready(function($){
$('li').click(function(){
var content = $("li:hover").attr("id");
if (content == null) {
document.getElementById('descriptionUE').innerHTML = "<b>Cliquez sur une UE pour voir sa description.</b>";
} else {
document.getElementById('descriptionUE').innerHTML = "<b>Description de l'UE: " + $("li:hover").html() + "</b> <br/><br/>" + content;
}
});
});
</script>
<script type="text/javascript">
var pos = [];
function afficherPos(){
var s = "";
for(var i = 0; i < pos.length; ++i){
s += pos[i] + "/";
}
s += " ";
$("#affiche").html(s);
document.getElementById("choixEtudiant").value = document.getElementById("affiche").innerHTML;
}
function maListe(idname) {
var obj = $("#"+idname);
obj.sortable({
placeholder : 'ui-state-highlight',
cursor : 'crosshair',
revert : true,
update : function(){
pos = obj.sortable('toArray');
afficherPos();
}
});
obj.disableSelection();
}
$(document).ready(function(){
maListe("sortable2");
});
function verifierChoix() {
var nbChoix = document.getElementById("choixEtudiant").value.split("/").length;
var nbUEAChoisir = ${nbUEAChoisir};
if (nbChoix == nbUEAChoisir + 1) {
return true;
}
else {
alert("Vous devez choisir " + nbUEAChoisir + " UE !");
return false;
}
}
window.onload = verifierChoix();
$(document).ready(function(){
verifierChoix();
});
</script> |
Et une partie du code de la jsp
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
| <form method="post" action="consultationChoixEtudiant.html" onsubmit="return verifierChoix()">
<div class="span4">
<div class="well-white" style="height:250px">
<div class="lesUE" >
<div class="label label-info">Les UE proposées: </div><br/>
<ol id="sortable1" class='droptrue'>
<c:set var="testVar" value="0" scope="page" />
<c:set var="testVal" value="0" scope="page" />
<c:forEach items="${lesListes['lesUEProposees']}" var="UE">
<c:forEach items="${lesUEAff}" var="LUEAff">
<c:if test="${UE.idUE eq LUEAff.idUE}">
<c:set var="testVar" value="1"/>
</c:if>
</c:forEach>
<c:forEach items="${lesUEValidees}" var="lUEV">
<c:if test="${UE.idUE eq lUEV.idUE}">
<c:set var="testVal" value="1"/>
</c:if>
</c:forEach>
<c:if test="${testVar==0}">
<c:if test="${testVal==0}">
<li class="info" id="${UE.description }"><i class="icon-list"></i>${UE.idUE}<span>${UE.description }</span></li>
</c:if>
</c:if>
<c:set var="testVar" value="0"/>
<c:set var="testVal" value="0"/>
</c:forEach>
</ol>
</div>
</div>
</div>
<div class="span4">
<div class="well-white" style="height:250px">
<div class="lesUE" >
<div style="display:none" id="affiche"></div>
<input name="choixEtudiant" type="hidden" id="choixEtudiant"></input>
<div class="label label-info">Vos choix: </div><br/>
<ol id="sortable2" class='droptrue'>
</ol>
</div>
</div>
</div>
</div>
<br/><br/>
<div id="validerChoix">
<input type="submit" class="btn btn-info" value="Valider mes choix">(Attention, vous ne pourrez plus les modifier !)</input>
</div>
</form> |
Un grand merci à tous ceux qui auront pris le temps de me lire ... Si vous avez des idées, je suis plus que preneur :)
