Bonjour à tous,


J'utilise jquery et datatables.

J'ai un souci avec une routine javascript "plus()",
qui gère des checkbox.
Sans entrer dans le détail, en voici le fonctionnement.
chaque checkbox cochée :
- visualise une colonne (en fonction de la variable colhidden) et
- diminue la hauteur de la table (et des blocs englobants)
Cela ce sont les souhaits...
La réalité est loin de là !

Tout fonctionne, sauf...
la redéfinition du dataTables !!!
voici un lien de la page

Pouvez-vous m'aider ?
D'avance, je vous en remercie !

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
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
 
	function plus(element) {
		var elements = element.form.elements;
		var ii = 0;
    	var colhidden = new Array();
		var sk, swtrouve;
		var nbsuppl = 0;
		var nboption = 0;
		for (var k=0; k<elements.length; k++) {
			if (elements[k].type == "checkbox") {
				for (var m=0; m<8; m++) {
					if (elements[k].value == option[m]) {
						if (elements[k].checked) {
							if (elements[k].value != "Colette") {
								nbsuppl++;
							}
							nboption++;
						} else {
							colhidden[ii] = 7 + m;
							ii++;
						}
						m=8;
						break;
					}
				}
			}
		}
		var haut1204 = parseInt((nbsuppl+2)/3) * 79;
		var bloc10 = (263+haut1204)+"px";
		var bloc11 = (263+haut1204)+"px";
		var bloc12 = (253+haut1204)+"px";
		var bloc13 = (245+haut1204)+"px";
		var bloc30 = (650-haut1204)+"px";
		var bloc31 = (638-haut1204)+"px";
		var bloc32 = (620-haut1204)+"px";
		var example = (615-haut1204)+"px";
		var coef = (100 + 10 * nboption)+"%";
		var size = 15-nboption;
		if (size < 12) {
			size = 12;	
		}
		size = size+"px";
		document.getElementById('example').style.fontSize=size;
		document.getElementById('example').style.height=example;
		document.getElementById('bloc10').style.height=bloc10;
		document.getElementById('bloc11').style.height=bloc11;
		document.getElementById('bloc12').style.height=bloc12;
		document.getElementById('bloc13').style.height=bloc13;
		document.getElementById('bloc30').style.height=bloc30;
		document.getElementById('bloc31').style.height=bloc31;
		document.getElementById('bloc32').style.height=bloc32;
		for (k=0; k<elements.length; k++) {
			if ((elements[k].type == "checkbox") && elements[k].value != "Colette") {
				name=elements[k].name;
				name=name.substr(8);
				name=name.substr(0,name.length-1);
				name=parseInt(name)+11;
				name="choix"+name;
				if (elements[k].checked) {
					document.getElementById(name).style.visibility="visible";
					document.getElementById(name).style.width="200px";
					document.getElementById(name).style.height="59px";
					document.getElementById(name).style.maxWidth="200px";
					document.getElementById(name).style.maxHeight="59px";
					document.getElementById(name).style.marginTop="13px";
					document.getElementById(name).style.marginRight="9px";
					document.getElementById(name).style.marginBottom="7px";
					document.getElementById(name).style.marginLeft="9px";
				} else {
					document.getElementById(name).style.visibility="hidden";
					document.getElementById(name).style.width="0px";
					document.getElementById(name).style.height="0px";
					document.getElementById(name).style.maxWidth="0px";
					document.getElementById(name).style.maxHeight="0px";
					document.getElementById(name).style.marginTop="0px";
					document.getElementById(name).style.marginRight="0px";
					document.getElementById(name).style.marginBottom="0px";
					document.getElementById(name).style.marginLeft="0px";
				}
			}
		}
		$('#example').dataTable( {
			"sScrollY": example,
			"bPaginate": false,
			"aoColumnDefs": [ {
				"bVisible": false,
				"aTargets": colhidden
			} ],
			"sScrollX": "100%",
			"sScrollXInner": coef,
			"bRetrieve": true
		} );
	}