Redéfinir un dataTables ?

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 (dans les critères avancés) :
- visualise une colonne supplémentaire dans la table (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 !!!

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

	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
		} );
	}

Modifié par jytest (09 Feb 2013 - 20:42)