Tu t'es trompé, la méthode getCheckBoxValue EST la fonction de comparaison.
Elle reçoit donc 2 arguments, un objet1 et un objet2 correspondant à 2 lignes à trier.
Elle devrait donc être du style
Je te laisse adapter...
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7 function getCheckBoxValue(o1, o2) { if (o1 < o2) return -1; if (o1 > o2) return 1; return 0; }
C'est pas ça, ça marche moins bien encore.
PS : je me demande ce que veut dire o1<o2 pour des checkbox![]()
Damned, j'ai raté un truc... désolé
Peux-tu essayer ceci
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9 function getCheckBoxValue (oRow, nColumn) { if (oRow.cells[nColumn].firstChild.checked) { return parseInt("0"); } return parseInt("1"); }
Eh non, pareil que ce que j'avais : ça trie correctement les cases déjà cochées mais si on en ajoute une et qu'on trie de nouveau, la nouvelle case disparaît![]()
Ça voudrait dire que la bibliothèque ne se base pas sur le tableau html mais sur une "copie"...
Pourrais-tu montrer la page dans son ensemble ?
J'ai pas suivi l'idée mais je comprendrais peut-être à la prochaine étape.
Voilà toute la page jsp :
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 <%@ taglib uri="http://jakarta.apache.org/struts/tags-html-el" prefix="html-el"%> <%@ taglib uri="http://jakarta.apache.org/struts/tags-bean-el" prefix="bean-el"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <html-el:form action="/myAction.do"> <html-el:hidden property="reqCode" value="validItem" styleId="reqCode"/> <c:if test="${!empty myActionForm.itemMap}"> <div class="tableau"> <table width="100%" border="0" cellspacing="0" cellpadding="0" class="margezero" id="titre"> <tr> <th align="left">My Item list</th> <th align="right">Select All/None <input type='checkbox' name='checkall' onClick="this.value=check(this.form.selectedItem)"></th> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="0" class="margezero" id="myItems"> <thead> <tr> <th><bean-el:message key="item.id"/></th> <th><bean-el:message key="item.name"/></th> <th> </th> </tr> </thead> <c:forEach var="itemMap" items="${myActionForm.itemMap}"> <tr> <td>${itemMap.key}</font></td> <c:set var="ici">true</c:set> <c:forEach var="item" items="${myActionForm.selectedItem}"> <c:if test="${item eq itemMap.key}"> <td><a href="myAction.do?reqCode=readItemFile&itemId=${itemMap.key}" onclick="submit();">${itemMap.value.name}</a></td> <td align="center"><input type="checkbox" name="selectedItem" value="${itemMap.key}" checked="checked"/></td> <c:set var="ici">false</c:set> </c:if> </c:forEach> <c:if test="${ici eq true}"> <td>${itemMap.value.name}</td> <td align="center"><input type="checkbox" name="selectedItem" value="${itemMap.key}"/></td> </c:if> </tr> </c:forEach> </table> <table width="100%" border="0" cellspacing="0" cellpadding="0" class="margezero" id="bouton"> <tr> <td colspan="3" align="center"> <html-el:submit onmouseover="this.className='btn btnhov'" onmouseout="this.className='btn'" styleClass="btn"> <bean-el:message key="label.validate" /> </html-el:submit> </td> </tr> </table> </div> <script type="text/javascript"> //<![CDATA[ var st = new SortableTable( document.getElementById("myItems"), ["Number", "String", "CheckBox"] ); function getCheckBoxValue (oRow, nColumn) { return oRow.cells[nColumn].firstChild.checked ? 0 : 1; }; st.addSortType("CheckBox", null, null, getCheckBoxValue); //]]> </script> </c:if>
Donc, le comportement se précise...
Tu ne charges la table qu'à l'initialisation de la page alors qu'il faudrait le faire à chaque fois que tu cliques pour trier.
J'ai vu dans le code de la bibliothèque que tu avais un setTable(...), je te suggère donc d'essayer comme ceci
ou si tu préfères
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4 ... <table width="100%" border="0" cellspacing="0" cellpadding="0" class="margezero" id="myItems" onclick="st.setTable(this)"> ...
Ça devrait régler ton problème
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4 ... <table width="100%" border="0" cellspacing="0" cellpadding="0" class="margezero" id="myItems" onclick="st.setTable(document.getElementById('myItems')"> ...
T'es sûrement pas loin...et moi pas loin de comprendre :
J'ai d'abord recopié bêtement onclick="st.setTable(this)"
Comme ça marche pas, je me suis dit : mais ça veut dire quoi de mettre "st" ici, le code html ne sait pas ce que c'est.
Alors j'ai fait :
onclick="setTableOnClick(this)"
où j'ai la fonction :
Mais ça ne résoud toujours pas le problème
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3 function setTableOnClick(param){ st.setTable(param); };
![]()
Normalement, il devrait trouver st puisqu'à la fin de ta page tu as
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11 <script type="text/javascript"> //<![CDATA[ var st = new SortableTable( document.getElementById("myItems"), ["Number", "String", "CheckBox"] ); function getCheckBoxValue (oRow, nColumn) { return oRow.cells[nColumn].firstChild.checked ? 0 : 1; }; st.addSortType("CheckBox", null, null, getCheckBoxValue); //]]> </script>
Peut-être oui (j'aurais pensé que st était locale au javascript).
Mais quoi qu'il en soit, l'ajout de onclick="st.setTable(this)" ne corrige toujours pas le fait que les cases cochées disparaissent après avoir cliqué sur le tri de la colonne.
C'est quelle bibliothèque au juste ?
Heu... laquelle?
Si c'est à propos de Sortable, ça vient d'ici
Bon, ce n'est pas la bibliothèque, je viens de la tester avec ce qui suit et ça fonctionne très bien, même pas besoin du setTable(...).
Par contre, ça m'a permis de voir un peu son fonctionnement.
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 <html> <head> <script src="js/sortabletable.js"></script> <link type="text/css" rel="StyleSheet" href="css/sortabletable.css" /> <style> .header{ background:#505050; color:#ffffff; } </style> <script> var st = null; function pageLoaded() { st = new SortableTable(document.getElementById("tbl"), ["Checkbox", "String"]); st.addSortType("Checkbox", null, null, getCheckBoxValue); } function getCheckBoxValue (oRow, nColumn) { // alert(oRow.cells[nColumn].firstChild.checked); if (oRow.cells[nColumn].firstChild.checked) { return parseInt("0"); } return parseInt("1"); } </script> </head> <body onload="pageLoaded()"> <form> <table id="tbl" border="1"> <thead> <tr> <td class="header">Col 1</td> <td class="header">Col 2</td> </tr> </thead> <tbody> <tr> <td><input type="checkbox" name="selectedItem" value="1"/></td> <td>ligne 1</td> </tr> <tr> <td><input type="checkbox" name="selectedItem" value="2"/></td> <td>ligne 2</td> </tr> <tr> <td><input type="checkbox" name="selectedItem" value="3"/></td> <td>ligne 3</td> </tr> <tr> <td><input type="checkbox" name="selectedItem" value="4"/></td> <td>ligne 4</td> </tr> </tbody> </table> <input id="btn" type="submit" value="Essaye encore"/> </form> </body> </html>
Il ne faut pas se tromper dans le type des colonnes ni leur ordre...
Oui, mais ça me dit pas ce qui cloche chez moi :
J'affiche bien une ligne de {Integer, String, Checkbox} donc ce n'est pas une question d'ordre dans
Code : Sélectionner tout - Visualiser dans une fenêtre à part var st = new SortableTable( document.getElementById("items"), ["Number", "String", "CheckBox"] );
Effectivement, mais tu ne fournis qu'un code partiel, il manque toute la partie "template".
A la limite, post le code à partir de l'option "source" sur le browser, là, on verra tout.
Si tu as Firefox, le plugin WebDeveloper a une option permettant de récupérer le code après interprétation d'éventuels script, encore mieux...
Pourtant j'ai posté la jsp, la librairie de tri, et il y a juste à savoir que dans mon ActionForm j'ai une liste d'Integer itemList.
Bon, je jette l'éponge...
Merci quand-même.
Partager