Tableau scrollable

Signaler
Messages postés
17
Date d'inscription
lundi 4 mai 2009
Statut
Membre
Dernière intervention
8 juin 2014
-
Messages postés
17
Date d'inscription
lundi 4 mai 2009
Statut
Membre
Dernière intervention
8 juin 2014
-
Bonjour,
J'ai un problème avec un tableau.
Je veux un tableau avec l'entête fixe et le corps du tableau qui puisse défiler.
Voilà une partie de mon code concernant ce tableau :

---
{
print("<form action= "".$_SERVER['PHP_SELF']."" method="post">");
print("<caption>Enregistrements pour $resultat</caption>\");
print(\"----
\");

print(\" Commune |\");
print(\"Naissance |\");
print(\"Nom |\");
print(\"Prénom |\");

print(\"\");

print(\"----
");
print("
");
print("<table>");

$ligne = 0;
while (list($s_paroisse, $s_date_n, $s_nom, $s_prenom) = mysql_fetch_row($result))
{
if ($ligne == 0)
{
print("----
");
$ligne = 1;
}
else
{
print("----
");
$ligne = 0;
}
print(", $s_paroisse</td>\");
print(\"$s_date_n, \");
print(\"$s_nom, \");
print(\"$s_prenom, \");
print(\"\");
}
print("

");
print("</td></tr></tbody></table>");
print("

");
print('</form>');
}
---

En sortie j'ai l'entête comme ceci :

----------------------------------------------------------------
| Commune |Naissance| Nom |Prénom |
|----------------------------------| |
|Paris 01/01/1970 TOTO Prénom |
| .....


J'ai donc la cellule th commune de l'entête qui recouvre les 4 cellules td et sous les cellules th naissance, nom et prénom je n'ai rien.
je n'ai pas d'ascenseur à droite (malgré mon overflow:auto ou même scroll), mais je peux quand même défiler avec la souris.
Mais en défilant l'entête remonte, elle ne reste pas fixe.
Mes largeurs de cellule s'alignent sur le plus grand mot et non sur ma largeur que j'ai définie.

Donc mes questions, qu'est ce que j'ai fait ou pas fait dans ce code qui ne convient pas ?
Je souhaiterais que les cellules th de l'entête correspondent aux cellules td des lignes du tableau.
Je souhaiterais qu'il y ait un ascenseur sur la droite et que mon entête reste fixe.
Je souhaiterais alterner une ligne sur 2 avec une couleur (pourtant testé et non pris en compte).
Je souhaiterais que les mots composés s'affichent sur une seule ligne (par ex un prénom comme Jean Marie est écrit sur 2 lignes)
Je souhaiterais que les largeurs définies par mes width soient bien prises en compte.
Et de plus le bouton input type=submit value="Retour" de l'avant dernière ligne ne s'affiche pas car le tableau prend tout l'écran.

J'essaie tout un tas de variantes et je n'arrive toujours pas, alors merci beaucoup si vous pouvez me sortir de ce pétrin.

Amicalement.

5 réponses

Messages postés
17
Date d'inscription
lundi 4 mai 2009
Statut
Membre
Dernière intervention
8 juin 2014

En fait l'ascenseur y est bien et mon bouton retour aussi, mais le tableau fait la hauteur de toutes les lignes de mon fichier malgré la largeur et la hauteur que j'ai pourtant défini en witdh et height dans <table> et là non plus ce n'est pas pris en compte.
Messages postés
1309
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
5 juin 2013
12
Salut,

Donc mes questions, qu'est ce que j'ai fait ou pas fait dans ce code qui ne convient pas ?

La grosse bêtise que je vois est d'abord conceptuelle : il faut éviter autant que possible de faire de la mise en forme dans le html. Commence donc déjà par virer tous les attributs qui servent à al mise en forme de ton tableau et utilise une feuille de style séparée, ce sera bien plus pratique.

Je souhaiterais que les mots composés s'affichent sur une seule ligne (par ex un prénom comme Jean Marie est écrit sur 2 lignes)

Désolé, mais ceci est impossible à garantir. On peut en limiter au maximum le risque mais pas l'exclure totalement.
Messages postés
17
Date d'inscription
lundi 4 mai 2009
Statut
Membre
Dernière intervention
8 juin 2014

Bonjour,
Voilà j'avance mais encore des problèmes :

---
print("
");
print("<caption>Enregistrements pour $resultat</caption>\");
print(\"----
\");

print(\"Commune |\");
print(\"Naissance |\");
print(\"Nom |\");
print(\"Prénom |\");
print(\"\");

print(\"\");
$ligne = 0;
while (list($s_paroisse, $s_date_n, $s_nom, $s_prenom) = mysql_fetch_row($result))
{
if ($ligne == 0)
{
print(\"----
\");
$ligne = 1;
}
else
{
print(\"----
\");
$ligne = 0;
}
print(\"$s_paroisse, \");
print(\"$s_date_n, \");
print(\"$s_nom, \");
print(\"$s_prenom, \");
print(\"\");
}
print("

");
---

J'ai bien mon tableau complet, titre et lignes bien alignés, mais encore ces manques :
Malgré mon width et mon height dans le div de la table, le tableau se cale à gauche avec une largeur correspondante aux plus grands mots des lignes et dépasse l'écran en hauteur.
J'ai sur la droite de l'écran une ligne pour un ascenseur, mais elle est disabled et n'a pas le grand bouton de déplacement malgré mon overflow:scroll
Mon entête n'est pas fixe et remonte quand je déplace les lignes vers le bas avec la roulette de la souris.
Et toujours les largeurs de cellule se calent sur le plus grand mot et non sur mon width qui est pourtant défini.
Je mettrais tous les styles en css quand tout sera au point.
Merci de vos réponses.
Messages postés
1309
Date d'inscription
samedi 31 janvier 2009
Statut
Membre
Dernière intervention
5 juin 2013
12
Salut,

Je mettrais tous les styles en css quand tout sera au point.

C'est une idée exceptionnellement mauvaise.

Sinon j'ai un petit truc qui devrais t'aider : jQuery Scrollable Table Plugin. Bien entendu, pour utiliser ce plugin il te faut utiliser jQuery.
Messages postés
17
Date d'inscription
lundi 4 mai 2009
Statut
Membre
Dernière intervention
8 juin 2014

J'ai trouvé !!!
Une classe dans le thead avec un display:block, les width et height et une classe dans le tbody avec overflow:auto, un display:block et les width et height, puis définition du td avec sa width.
Et çà marche super bien.
Merci à tous.