Afficher un array dans un tableau html [Résolu]

xzonz 103 Messages postés mardi 13 janvier 2004Date d'inscription 18 février 2014 Dernière intervention - 6 oct. 2011 à 13:09 - Dernière réponse : xzonz 103 Messages postés mardi 13 janvier 2004Date d'inscription 18 février 2014 Dernière intervention
- 18 oct. 2011 à 18:53
salut a toutes et tous

voici ma question:

j'ai un array() unidimensionnel qui peut contenir x éléments (selon les cas)
de type

et j'aimerais afficher le contenu de ce array()
dans un tableau html de 7 colonnes.
(aucune importance pour le nombre de lignes)

ca ne marche pas !!
j'ai cherché sur le net mais rien trouvé
de bien clair ...

auriez vous la gentillesse de me montrer un
exemple que je puisse comprendre et re utiliser.

merci pour votre aide

Franck
Afficher la suite 

Votre réponse

5 réponses

Meilleure réponse
cs_jperre 268 Messages postés lundi 9 janvier 2006Date d'inscription 19 janvier 2017 Dernière intervention - 18 oct. 2011 à 14:41
3
Merci
<script type="text/javascript">
var arImg=new Array();//Création du tableau d'images
arImg[0]="img1.jpg";//affectation des images aux éléments du tableau
arImg[1]="img2.jpg";
...
...
...
arImg[n]="imgx.jpg";

function showImg() {
/*Fonction d'affichage des images dans un tableau HTML de 7 colonnes et de nbLn lignes */
var tbs=document.createElement("table");//Création du tableau HTML
var n=0;//Initialisation des variables des boucles for
var m=0;
//Calcul du nombre de lignes
if ((arImg.length % 7) > 0) {//Division du nombre d'image par 7
var nbLn=Math.floor(arImg.length / 7) + 1;//division non entière
}
else {
var nbLn=arImg.length / 7;//division entière
}
var ptImg=0; //Pointeur image
for (n=0;n<nbLn;n++) {//Insertion des lignes du tableau
var tln=tbs.insertRow[n];
for (m=0;m<7;m++) {//Insertion des cellules dans les lignes
var tcel=tln.insertCell[m];
if (ptImg

Mon script avec beaucoup plus de commentaires afin que vous compreniez mieux
le fonctionnement de la fonction showImg().

Merci cs_jperre 3

Avec quelques mots c'est encore mieux Ajouter un commentaire

Codes Sources a aidé 93 internautes ce mois-ci

Commenter la réponse de cs_jperre
@karamel 1661 Messages postés vendredi 9 mai 2008Date d'inscription 23 août 2018 Dernière intervention - 6 oct. 2011 à 14:47
0
Merci
bonjour voila un exemple qui crée un tableau, ajoute une ligne puis ajoute des colonne dans lesquelles on crée une balise img que l'on alimente par un array

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="JavaScript" type="text/javascript">

tbgema= new Array('5.jpg','32.jpg','33.jpg','34.jpg','71.jpg','78.jpg','83.jpg','89.jpg','92.jpg','10.jpg')

function ttb(){

var tbs=document.createElement('table');

tbs.insertRow(-1)


for(var i = 0; i < tbgema.length; i++) {

tbs.rows[0].insertCell(i)
var igm=document.createElement('img')
igm.src=tbgema[i];
tbs.rows[0].cells[i].appendChild(igm);

}

document.body.appendChild(tbs);

}
</script>
</head>

marche

</html>
Commenter la réponse de @karamel
cs_jperre 268 Messages postés lundi 9 janvier 2006Date d'inscription 19 janvier 2017 Dernière intervention - 18 oct. 2011 à 14:17
0
Merci
Moi je génèrerais le code suivant :
<script type="text/javascript">
var arImg=new Array();
arImg[0]="img1.jpg";
arImg[1]="img2.jpg";
...
...
...
arImg[n]="imgx.jpg";
function showImg() {
var tbs=document.createElement("table");
var n=0;
var m=0;
//Calcul du nombre de lignes
if ((arImg.length % 7) > 0) {
var nbLn=(arImg.length / 7) + 1;//division non entière
}
else {
var nbLn=(arImg.length / 7;//division entière
}
var ptImg=0; //Pointeur image
for (n=0;n<nbLn;n++) {
var tln=tbs.insertRow[n];
for (m=0;m<7;m++) {
var tcel=tln.insertCell[m];
if (ptImg

J'utiliserais ensuite un élément pour lancer la fonction showImg() à partir de
l'attribut événementiel onclick de cet élément.

Si cela peut aider!...
Commenter la réponse de cs_jperre
cs_jperre 268 Messages postés lundi 9 janvier 2006Date d'inscription 19 janvier 2017 Dernière intervention - 18 oct. 2011 à 14:22
0
Merci
Une petite erreur à corriger dans mon code :
il y a :
var nbLn=(arImg.length / 7) + 1;//division non entière

il faut
var nbLn=Math.floor(arImg.length / 7) + 1;//division non entière

Excusez moi!...
Commenter la réponse de cs_jperre
xzonz 103 Messages postés mardi 13 janvier 2004Date d'inscription 18 février 2014 Dernière intervention - 18 oct. 2011 à 18:53
0
Merci
merci beaucoup c'est vraiment sympa

je pense que sans aide j'aurais mis ... disons beaucoup de temps
pour en arriver la

je vais décortiquer le code pour voir comment cela fonctionne.
et surtout le mettre de coté

merci Kazma et Jperre pour votre aide

Franck
Commenter la réponse de xzonz

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.