Discussion :

[Trebor_]

Bonjour,
Je souhaite afficher un tableau dans lequel chaque item possède 3 éléments:

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<table id="tableau">
    <tr id="ligne_00">
	<td><img  . . . /></td>  <!--  Ici une Image  -->
	<td><text> . . . </text></td>  <!--  Ici un texte-->
	<td><img  . . ./></td>  <!--  Ici une Image  -->
    </tr>
</table>

Je peux avoir de 1 à 100 items.

Je dois afficher chaque item sous une forme linéaire: Image / Texte / Image

? Peut-on me confirmer que c'est bien avec JavaScript que je vais construire dynamiquement la suite de mon tableau en HTML et ma CSS pour l'affichage de mes x lignes dont je ne connais pas le nombre.

D'avance, merci.

[Michel]

Pourquoi pas mais la question est trop vague !
d’où proviennent les images et les texte ?
cette page est-elle crée à partir d’une base de données côté serveur ?

[Trebor_]

Les données Images sont référencées dans la base de données mais sont physiquement dans un fichier côté serveur,
le Texte est dans la base de données.

Cette page est créée à partir des données ci-dessus.

[jisig]

Tu peux générer ton tableau html dynamiquement avec un langage côté serveur (php, python, ...)
ou les envoyer dans un format tel que json ou autres et le construire en javascript

[Invité]

Bonjour,

Tu as forcément un langage dynamique pour communiquer avec la base de données.
Certainement PHP, non ?

C'est donc en PHP que tu peux construire la <table> à partir des données issues de la base de données.

• Affichage de données dans un tableau HTML

[Trebor_]

Bien sûr, je sais construire dynamiquement mon tableau en PHP avec ma base de données;

mais ensuite, comment faire un affichage régulier ligne par ligne à l'écran

Je vous joins un exemple:

[Trebor_]

P.S.: Le texte peut avoir de 1 à 6 ligne et il chaque ligne doit être centrée; et le texte global centré par rapport aux images.

[Invité]

Ça, c'est juste un style CSS.

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
text-align:center;
vertical-align:middle;

[Trebor_]

O.K. ça, je sais,

? Mais comment répéter n lignes sans en connaître exactement le nombre.

[jisig]

c'est un tuto qu'il faudrait

-> requête db tu obtiens tes résultats tu les tapes dans un array.
-> tu fais un foreach dessus
-> et tu fais un echo dans chaque 'tr' de ton tableau :o.

après tu fais ça en poo ? avec un framework ? ...

un exemple :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 <?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "myDB";
 
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}
 
$sql = "SELECT id, firstname, lastname FROM MyGuests";
$result = $conn->query($sql);
 
if ($result->num_rows > 0) {
    echo "<table>";
    // output data of each row
    while($row = $result->fetch_assoc()) {
        //ici tu remplaces par tes tr 
        echo "id: " . $row["id"]. " - Name: " . $row["firstname"]. " " . $row["lastname"]. "<br>";
    }
    echo "</table>";
} else {
    echo "0 results";
}
$conn->close();
?>

[Invité]

Bien sûr, je sais construire dynamiquement mon tableau en PHP avec ma base de données;

Mais comment répéter n lignes sans en connaître exactement le nombre.

alors ?? Tu SAIS, ou tu NE SAIS PAS ??

Tes questions sont très... confuses.

Montres-nous le script qui génère ton tableau via PHP.

[Trebor_]

Je n'ai pas encore commencé à écrire ma page HTML, simplement, j'y réfléchi avant de me lancer la tête la première.

Le sujet, c'est la cohérence entre HTML et CSS.

? Comment écrire une CSS qui soit en harmonie avec HTML, étant donné que je vais afficher un nombre d'items aléatoire dont je ne connais pas, chaque fois, le nombre exact.

Je fais, exemple, une CSS pour 10 items et au final, je dois en afficher 15.

? Comment insérer ces descriptions CSS correspondant aux 5 lignes supplémentaires.

? Par Javascript.

[Invité]

Quelle différence cela fera d'avoir 10, 15, 50 ou 100 lignes ?
Il sera juste plus long...

• Lis des cours de HTML, CSS,
• recherche des tutos sur les tableaux (x)HTML,
• fais des exercices simples,...

[Trebor_]

! C'est bon.
Je commence mon projet et ne manquerai par de revenir si nécessaire.

[Trebor_]

Bonjour,
Je souhaiterais savoir si c'est bien sous la forme d'un tableau ( dynamique ) que je peux constituer et afficher ma Base de Données.
Exemple:

Au départ, je ne connais jamais le nombre d'items qu'il va y avoir.

Merci de vos conseils

[Invité]

Bonjour,

Tu as le choix :

• continuer à te poser des questions existentielles
• ou (enfin !!!) passer à la pratique

N'aies pas peur de faire des erreurs.
C'est AUSSI comme ça qu'on progresse.



Et le nombre d'items n'influe pas sur l'affichage.

[Trebor_]

Mon problème se complique:
Suivant la nature des enregistrements de la BD ( au nombre de 2 au moins ), je vais avoir soit la présentation Tableau_1 soit la présentation Tableau_2, c'est-à-dire qu'en partie droite je vais avoir soit un texte de 6 lignes soit une image

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
 
<table id="Tableau_1">
	<tr id="Ligne0">
		<td colspan=3>Titre</td>
		<td></td>
	</tr>
	<tr id="Ligne1">
		<td rowspan=6>Image_1</td>
		<td >Texte_01</td>
	</tr>
		<tr id="Ligne2">
		<td>Texte_02</td>
	</tr>
	<tr id="Ligne3">
		<td>Texte_03</td>
	</tr>
	<tr id="Ligne4">
		<td>Texte_04</td>
	</tr>
	<tr id="Ligne5">
	       <td>Texte_05</td>
	</tr>
	<tr id="Ligne6">
		<td>Texte_06</td>
	</tr>
</table>
 
 
<table id="Tableau_2">
	<tr id="Ligne0">
		<td >Titre</td>
		<td></td>
	</tr>
	<tr id="Ligne1">
		<td >Image_1</td>
		<td >Image_2</td>
	</tr>
</table>

? Est-il possible de ne décrire qu'un seul tableau pour les deux cas.

[popo]

jreaux62,
Je crois que ce qui l'embête c'est la valeur à mettre dans le rowspan.
Car si j'ai bien compris, il peut y avoir 1 image avec 6 lignes de texte, puis 1 image avec trois lignes de texte, etc.

Si c'est bien le cas, je suppose que tu récupères les images et pour chaque image tu récupère les textes.
Ou alors tu as tout d'un coup et tu as structure interne en arbre.
Comment arrive tes données ?

Suivant le cas, tu peux certainement connaître le nombre de lignes à afficher à coté de l'image et placer le bon rowspan.
Sinon, tu peux toujours abandonner le tableau et jouer avec des div.

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<div id="row1">
  <div><img /></div>
  <div>
    <div>Texte</div>
    <div>Texte</div>
    <div>Texte</div>
    <div>Texte</div>
  </div>
</div>

[Trebor_]

Résolu par une boucle en php