Checkbox -> Tableau -> Javascript ou php

Résolu
miguel -  
Bonjour,

Je suis en plein projet et j'ai réalisé un tableau en php qui répertorie tous les champs d'une table.
Malheureusement, le tableau a énormément de colonnes.

C'est pour celà que sur une page, j'aimerais que l'utilisateur ai des cases à cocher pour pouvoir choisir les colonnes qui apparaitront dans le tableau.

Est-ce que quelqu'un a une idée de comment s'y prendre ou alors un exemple car je pense que je peux y arriver si j'ai un exemple. (enfin si quelqu'un m'a compris.)

Merci de votre aide.
Configuration: Windows XP
Firefox 2.0.0.14

4 réponses

  1.  Dalida Contributeur
    salut,

    en fait c'est plus compliqué que je ne pensais !
    je pensais l'appliquer à une <col>, mais comme une <col> ne contient rien, ça ne sert pas à grand chose !

    après plusieurs heures de bournillage je te propose cette méthode.

    ce qui m'embête le plus c'est de devoir parcourir toutes les cellules à chaque fois mais c'est le meilleur moyen que j'ai trouvé.

    j'ai laissé les <tr> pour l'exemple mais tu peux leurs appliquer le même sort qu'aux <td> au lieu de modifier leur 'colspan'.

    bien évidement ce serait trop beau si tout fonctionnait parfaitement, IE (pour changer nous casse les cou***es car il) ne reconnait pas 'table-cell' comme valeur de 'display' ; il lui faut 'block'.

    il faudra donc ajouter un test pour savoir quelle valeur appliquer.
    1. miguel
      Merci beaucoup.

      C'est juste génial et comme je l'imaginais.

      Je reviens si j'ai un soucis.

      a+
    2. miguel
      @miguelJe n'ai pas compris l'histoire des <th>
      et d'ailleurs, je n'arrive pas à les faire disparaitre.
  2. Dalida Contributeur
    je coche ton fil comme "résolu".

    bon courage pour la suite et à plus !
    1. Dalida Contributeur
      salut,

      avec ça, ça devrait le faire : 
      var tds = document.getElementsByTagName( 'td' );
function setVisible( id , visible )
{
	var th = document.getElementById( 'th'+id );
	if( th )
	{
		var cn;
		if( visible )
		{
			for( var i = 0 ; i < tds.length ; i++ )
			{
				cn = String( tds[i].className );
				if( tds[i].className == id ) tds[i].style.display = 'table-cell';
			}
			th.style.display = 'table-cell';
		}
		else
		{
			for( var i = 0 ; i < tds.length ; i++ )
			{
				cn = String( tds[i].className );
				if( cn == id ) tds[i].style.display = 'none';
			}
			th.style.display = 'none';
		}
	}
}
      1. miguel
        yes c'est ça.

        Merci beaucoup!
    2. Dalida Contributeur
      salut,

      avec JS tu peux coder une fonction qui affichera/masquera la colonne.
      tu l'appelles depuis l'évènement 'onchange' de ton chexbox.
      en gros ça devrait faire :

      en HTML       
      <input onchange="toggleVisibility('col1')" type="checkbox" value="Nom de la colonne 1"/>
<input onchange="toggleVisibility('col2')" type="checkbox" value="Nom de la colonne 2"/>
<input onchange="toggleVisibility('col3')" type="checkbox" value="Nom de la colonne 3"/>
<input onchange="toggleVisibility('col4')" type="checkbox" value="Nom de la colonne 4"/>
<input onchange="toggleVisibility('col5')" type="checkbox" value="Nom de la colonne 5"/>

      en JS 
      function toggleVisibility( id )
{
	var lmt = document.getElementById( id );
	if( lmt )
	{
		if( lmt.display = 'none' )
		{
			lmt.display = 'block';
		}
		else
		{
			lmt.display = 'none';
		}
	}
}
      1. miguel
        Merci beaucoup, mais n'étant pas très doué en JS, je ne vois pas vraiment où poser ce code.

        Voici mon fichier: 
        <?php
$odbc = odbc_connect('parcinfo','root','') or die("Could Not Connect to ODBC Database!");
?>

<html>
</head>

<link href="../style/style.css" rel="stylesheet" type="text/css" media="screen" />
		<script src='gestion/sorttable.js'></script>
		</head>
<title>Gestion des sites</title>
<table class='sortable' border="1">
<?php
    $resultat = odbc_exec($odbc, "SELECT Num_site, Nom_site, adr_site, tel_site, mail_site FROM Site;") or die (odbc_error());
	echo "
		<th class='donnees'>Nom</th>
		<th class='donnees'>Adresse</th>
		<th class='donnees'>Telephone</th>
		<th class='donnees'>Mail</th>
		<th class='donnees' colspan=2>Choix</th>";
    while ($donnees = odbc_fetch_array($resultat))
    {
		echo '<form method="post" action="gestion/site_mod.php">
		<input type="hidden" name="Num_site" value="' . $donnees['Num_site'] . '" />';
        echo "<tr><td value='nom_site'>";
        echo $donnees['Nom_site'];
        echo "</td>";
		echo "<td value='adr_site'>";
        echo $donnees['adr_site'];
        echo "</td>";
		echo "<td value='tel_site'>";
        echo $donnees['tel_site'];
        echo "</td>";
		echo "<td value='mail_site'>";
		echo $donnees['mail_site'];
		echo "</td>";
		echo "<td class='donnees'>";
		echo '<a href="'. $value['Modifier'].'" onclick="window.open(\'gestion/site_mod.php?Num_site='.$donnees['Num_site'].'\',\'\',\'toolbar=no,status=no,width=500,height=280,scrollbars=no,location=no,resize=no,menubar=no\');return false" title="Tranf&eacute;rer">Modifier</a> ';
		echo "</td>";
		echo "<td class='donnees'>";?>
		<a href="gestion/site_suppr.php?Num_site=<?php echo $donnees['Num_site']; ?>" onclick="return(confirm('Etes-vous sûr de vouloir supprimer cette entrée?'));">Supprimer</a>
		<?php
		echo "</td></tr>";
		echo '</form>';
    }
 ?>
</table>
<form action="gestion/site_ajout.php">
<?php echo '<a href="'. $value['Ajouter'].'" onclick="window.open(\'gestion/site_ajout.php\',\'\',\'toolbar=no,status=no,width=600,height=380,scrollbars=no,location=no,resize=no,menubar=no\');return false" title="Tranf&eacute;rer">Ajouter</a> '; ?>
</form>
<input onchange="toggleVisibility('col1')" type="checkbox" value="nom_site"/>
<input onchange="toggleVisibility('col2')" type="checkbox" value="tel_site"/>
<input onchange="toggleVisibility('col3')" type="checkbox" value="mail_site"/>

</html>
<script>
function toggleVisibility( id )
{
	var lmt = document.getElementById( id );
	if( lmt )
	{
		if( lmt.display = 'none' )
		{
			lmt.display = 'block';
		}
		else
		{
			lmt.display = 'none';
		}
	}
}
</script>


        Malheuresement, ton script n'interragit pas avec le reste. (ca doit etre de ma faute :))

        Merci de ton aide Dalida

    Discussions similaires

    java script error in the main process
    ceciel2307

    3 réponses
    Tableau (croisé dynamique?) à 3 entrées
    ClementH3o

    10 réponses