Checkbox -> Tableau -> Javascript ou php

Résolu
miguel -  
Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   -
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 Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    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.
    2
    1. miguel
       
      Merci beaucoup.

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

      Je reviens si j'ai un soucis.

      a+
      0
      1. miguel > miguel
         
        Je n'ai pas compris l'histoire des <th>
        et d'ailleurs, je n'arrive pas à les faire disparaitre.
        0
  2. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    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
    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
      0
  3. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    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
    1. miguel
       
      yes c'est ça.

      Merci beaucoup!
      0
  4. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    je coche ton fil comme "résolu".

    bon courage pour la suite et à plus !
    0

Discussions similaires

java script error in the main process
ceciel2307 -
Thibaut -

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

10 réponses