Comment laisser une ligne fixe dans un tableau triable ?
Bonjour,
Voila, j'ai un tableau Dojo, qui est donc triable, mon problème est le suivant : la dernière ligne de mon tableau est une ligne de totaux, je voudrais donc que cette dernière ligne ne soit pas trié et reste en dernière position.
Comment puis-je faire cela ?
je vous remercie par avance.
Solution à adapter à tes besoins
Salut,
J'ai passé en revue le code de la DataGrid, et autant les headers ont un rendu spécifique, autant il n'est jamais fait allusion au moindre footer :? .
Une solution pourrait être de construire "astucieusement" les données (pour pouvoir repérer celles qui concernent les totaux) et ensuite de définir des tris personnalisés qui tiennent compte du format des données.
Pour le tri personnalisé, tu peux lire cette discussion http://www.developpez.net/forums/d70...-fonction-tri/
Sinon, voilà un exemple complet que je viens de finir et qui peut te servir de base de travail. L'idée est d'afficher des prix avec leur total
J'ai mis les commentaires dans le code.
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
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>grid</title>
<style type="text/css">
/* les styles nécessaires pour le type d'affichage souhaite */
@import "dojox/grid/_grid/nihiloGrid.css";
@import "dojox/grid/resources/Grid.css";
@import "dojo/resources/dojo.css";
</style>
<script type="text/javascript" src="dojo/dojo.js"
djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileReadStore");
//ex d'un store avec des prix
var datas= { identifier: 'id',
label: 'id',
items: [
{ id: '0', prix: 12 },
{ id: '1', prix: 17 },
{ id: '2', prix: 22 },
{ id: '3', prix: 18 },
/* ici le total en dernière ligne...
on triche un peu en changeant l'affichage
des données... mais c'est une démo ! */
{ id: '-4-', prix: '-69-' }
]};
//on crée le store
store = new dojo.data.ItemFileReadStore({data: datas});
//on va écrire pour chaque colonne une fonction de comparaison
//spécifique qui s'arrange pour que le tri garde les totaux en
//bas de tableau
//on utilise grid.sortInfo qui est une propriété de l'objet DataGrid
//telle que grid.sortInfo = (l'index de la colonne triée base 1) * (1 si ASC et -1 si DESC)
//ex: tri DESC sur col 2 -> grid.sortInfo=-2
store.comparatorMap = {};
//le comparator spécifique s'appuie sur la petite tricherie du format appliqué aux totaux
//La fin justifie les moyens, c'est l'idée qui compte !
//si a ou b n'est pas un nombre c'est que c'est un total (vu notre format)
//et on renvoie donc une valeur + ou - en fonction du type de tri ASC ou DESC
//en s'appuyant sur grid.sortInfo
store.comparatorMap["prix"] = function(a, b){
if (isNaN(a)) {
return grid.sortInfo;
} else if (isNaN(b)) {
return -grid.sortInfo;
} else {
return a-b;
}
}
//on copie la focntion pour les ids
store.comparatorMap["id"] = store.comparatorMap["prix"] ;
</script>
</head>
<body>
<table dojoType="dojox.grid.DataGrid"
jsid="grid" id="grid"
store="store" query="{ id: '*' }" rowsPerPage="20" rowSelector="20px">
<thead>
<tr>
<th field="id" width="300px">ID</th>
<th field="prix" width="auto">Prix</th>
</tr>
</thead>
</table>
</body>
</html> |
Tu peux tester par un copier-coller, c'est fonctionnel... reste à le mettre à ta sauce.
ERE
