Déroulement tableau PHP/HTML

Résolu/Fermé
Ibilolz Messages postés 131 Date d'inscription mardi 1 avril 2014 Statut Membre Dernière intervention 26 juin 2023 - Modifié par Ibilolz le 3/05/2014 à 15:39
tete0148 Messages postés 413 Date d'inscription mercredi 19 décembre 2012 Statut Membre Dernière intervention 15 juin 2017 - 3 mai 2014 à 16:05
Bonjour, je travaille sur un petit projet pour mon lycée et j'aurais besoin d'aide pour faire dérouler un tableaux. En gros, j'ai fais une page visualiser ou l'utilisateur peut voir l'ensemble du matériel du parc informatique du lycée avec un petit code java pour que quand on clique sur la catégorie choisie, la table SQL s'affiche sous forme d'un tableau dans une petite zone définie dans le code. Voici ma page visualiser :

<!DOCTYPE html>
<html>
  <head>
    <title>Salle</title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="css/style.css" />
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <style type="text/css">

    /*<![CDATA[*/
     .divs {display:none;}
     #Mat {
         position: absolute;
         width:400px; 
         height:180px; 
         top:600px; 
         left:280px; 
         border:1px white; 
         padding:2px; 
         background-color:#F7F7F7
     }
    /*]]>*/
    </style>
    <script type="text/javascript">
    //<![CDATA[
    function visibilite(id){document.getElementById("Mat").innerHTML = document.getElementById(id).innerHTML;}
    //]]>
    </script>

  </head>

  <body>
    <div id="bloc_page">
            <header>
                <!-- Bannière -->
                <div id="logo_raiatea">
                    <img src="banniere.png" alt="StEx" id="StEx" />
            </div>
                  <!-- Menu  -->
                <nav>
                        <ul>
                        <li><a href="index.php">Accueil</a></li>
                        <li><a href="salle.php">Salle</a></li>
                        <li><a href="materiel.php">Matériel</a></li>
   <li><a href="logiciel.php">Logiciel</a></li>
                        <li><a href="Inventaire.php">Inventaire</a></li>
   <li><a href="Config.php">Config</a></li>
                        <li><a href="Visualiser.php">Visualiser</a></li>
                    </ul>
                </nav>
            </header>
    <br></br>
    <FONT COLOR="teal" size=5><b><u>Gestion des salles</u> :</b></FONT>
    <br></br>
    <br></br>
            <!-- Corps -->
    <div id="Mat"> </div>
    
             <a href="javascript:visibilite('opt1');"><FONT COLOR="teal" size=4><u>Ajouter</u></FONT></a>  <br></br>
    <div id="opt1" class="divs">

        <FORM Method="POST" Action="">
        Numéro de la salle : <input type="text" name="num" size=10 <br></br>
        Description : <input type="text" name="descr" size=20 <br></br>
        Nombre de poste :<input type="text" name="nombre" size=20 <br></br>
        <br></br>
        <input type="submit", name="submit" Value="Ajouter"> 
 <?php

include 'fonctions.connect.php';

if ($_POST['num']!='' && $_POST['descr']!='' && $_POST['nombre']!='')

{

$num = $_POST['num']; 
$descr = $_POST['descr']; 
$nombre = $_POST['nombre']; 

    
    $sql = "INSERT INTO Salle (num_salle,description,nombre_poste)
VALUES ('$num','$descr','$nombre')";


mysql_query($sql) or die(mysql_error()) ;

}

?>

</div></FORM> 
           <br></br>
              <br></br>
             <div> <a href="javascript:visibilite('opt2');"><FONT COLOR="teal" size=4>Visualiser</FONT></a>  <br></br>
    <div id="opt2" class="divs">
    
                  <?php
                  include 'fonctions.connect.php';
                  $sql="SELECT * FROM Salle";
                  $exec=mysql_query($sql);  
                  echo                      
                  '<table>
                        <tr>
                          <th>Salle</th>
                          <th>Decription</th>
                          <th>Nombre de poste</th>
                        </tr>
                       ';
                  while ($ligne=mysql_fetch_array($exec))
                  {
                    echo   '  <tr>
                            <td>'.$ligne['num_salle'].'</td>
                            <td>'.$ligne['description'].'</td>
                            <td>'.$ligne['nombre_poste'].'</td>
                          </tr>';
                    }
                    echo '</table>';
                    ?>
                    </div>

        <br></br>
           <footer>

                        <p class="ligne_dessus"> Réalisé par Thomas Kraëber. </p>
    
                        <p class="barre"></p>  

        </footer>
  </body>
</html>


Voici une capture d'écran :

https://www.zupimages.net/

Mon problème est que comme la BD va se remplir, le tableau va devenir plus grand et je voudrais avoir un sorte de petite barre sur le coté classique pour le faire dérouler sans que sa allonge la page. Merci d'avance.
A voir également:

1 réponse

tete0148 Messages postés 413 Date d'inscription mercredi 19 décembre 2012 Statut Membre Dernière intervention 15 juin 2017 89
3 mai 2014 à 16:05
Je pense qu'il suffit de rajouter la propriété css overflow: scroll;
ensuite mettez les dimensions que vous souhaitez à votre tableau à l'aide de width et height
0