Accueil > Forum > > > > Creation dynamique d'un tableau en HTML
 Creation dynamique d'un tableau en HTML
lundi 16 avril 2007 à 17:29:09 |
Creation dynamique d'un tableau en HTML
AllalcoolG
|
Bonjour,
j'aimerais savoir s'il est possible d'ajouter des lignes à un tableau existant en HTML.
En fait j'ai un script vbs qui me permet de retourner de retourner des données en fonction d'un fichier *.text
ex si le fichier contient 40 lignes alors j'aimerais que mon tableau HTML en fasse 40 aussi
Merci de votre aide
|
|
lundi 16 avril 2007 à 18:11:08 |
Re : Creation dynamique d'un tableau en HTML
PetoleTeam
|
B
onjour...
Connait pas le vbs mais on peut procéder de la façon suivante en dynamique à l'ouverture de la page, dans le body donc...
<script type="text/javascript">
//-- Lecture Nombre de ligne
NbrLigne = Ta_Fonction();
//-- Creation du tableau
var Html = '<table>';
//-- Ajout des lignes
for( var i = 0; i <NbrLigne; i++)
Html += '<tr><td>.....<\/td><\/tr>';
Html += '<\/table>';
//-- Ecriture dans document
document.write( Html);
</script>
...la suite du body...
Pas sur que cela réponde à ton besoin.
;0)
|
|
lundi 16 avril 2007 à 18:46:08 |
Re : Creation dynamique d'un tableau en HTML
stfou
|
Bonjour, PetoleTeam >> Pas très élegant tout ça...
var tableau=document.createElement("table");
for(i=0;i<ligne;i++){tableau.insertRow()};
document.body.appendChild(tableau);
En supposant que le nombre de ligne est contenu dans la variable ligne.
STFOU
|
|
lundi 16 avril 2007 à 18:48:57 |
Re : Creation dynamique d'un tableau en HTML
|
lundi 16 avril 2007 à 19:41:21 |
Re : Creation dynamique d'un tableau en HTML
PetoleTeam
|
Pas très élégant, je le concéde mais sans plus d'indication c'est une approche...
Pour être plus élégant il va de soit qu'il faut, sur le onload du body par exemple, appeler la fonction Insert_Tableau()
Et pour être presque complet il convient de réaliser cela en DOM compatible à savoir
//-----------------------
function Insert_Tableau(){
var NbCol = 4; // par exemple
var NbLig = 10; // par exemple
//-- Creation de la TABLE
var O_Tab = document.createElement("table");
//-- Creation des Lignes
for( var i =0; i < NbLig; i++){
O_Tr = O_Tab.insertRow(-1); // -1 pour insertion à la suite
//-- Creation des Colonnes
for( var j =0; j < NbCol; j++){
O_Td = O_Tr.insertCell(j); // j pour insertion à la suite
//-- On met le texte eventuel
O_Td.innerHTML = 'Lig ' +i +' Col ' +j;
}
}
//-- On ajoute au BODY
document.body.appendChild(O_Tab);
}
Voila avec cela notre ami AllalcoolG devrait pouvoir résoudre son problème...
;0)
|
|
mardi 17 avril 2007 à 15:00:56 |
Re : Creation dynamique d'un tableau en HTML
AllalcoolG
|
La fonction Insert_Tableau marche top.
Petite question : Comment faire pourque le texte soit en gras et que les brodures soit visible et de couleur par exemple rouge?
|
|
mardi 17 avril 2007 à 17:19:25 |
Re : Creation dynamique d'un tableau en HTML
PetoleTeam
|
B
onjour...
Plusieures solutions possibles mais en voici une qui utilise les styles...
1/ dans le <head></head> ajout du style, c'est un exemple
<style type="text/css">
#la_table td{
color : #000000;
font-size : 13px;
font-weight : bold;
font-family : Verdana;
padding : 5px;
margin : 5px;
border: 1px solid #ff0000;
}
</style>
2/ dans la fonction Insert_Tableau() ajout de la ligne après appendChild
//-- On ajoute au BODY
document.body.appendChild(O_Tab);
O_Tab.id = "la_table"; // ajout id pour affectation du style
Voila that's all folks !
;0)
|
|
mardi 17 avril 2007 à 17:53:09 |
Re : Creation dynamique d'un tableau en HTML
AllalcoolG
|
J'arrive donc a contruire mon tableau avec ma mise en page ex 5 lignes et 3 colonnes
Des lors que le tableau est crée et s'affiche sur le navigateur, est il possible par la suite de changer des valeurs dedans.
ex ligne 3 colonne 2 = "Toto" --> aprés valiadaion sur un bouton changer Toto en Momo
|
|
mardi 17 avril 2007 à 18:06:21 |
Re : Creation dynamique d'un tableau en HTML
PetoleTeam
|
Tu es un heureux veinard, j'ai une fonction toute faite je te la livre...
//-------------------------------------------
function Modif_Valeur( id_, lig_, col_, val_){
var Obj = document.getElementById( id_);
var Nb_Ligne = Obj.rows.length;
if( lig_ <= Nb_Ligne){
var Nb_Col = Obj.rows[lig_].cells.length;
if( col_ <= Nb_Col){
Obj.rows[lig_].cells[col_].innerHTML = val_;
}
}
}
avec un appel du style
Modif_Valeur('la_table', 5, 5, 'Toto')
tu n'as plus qu'a adapter...
;0)
|
|
mardi 17 avril 2007 à 18:09:28 |
Re : Creation dynamique d'un tableau en HTML
|
Cette discussion est classée dans : dynamique, tableau, lignes, html, creation
 Répondre à ce message
 Livres en rapport
|
Derniers Blogs
 [RIA SERVICES] INCLUDE ET DOMAINDATASOURCE[RIA SERVICES] INCLUDE ET DOMAINDATASOURCE par Audrey
Dans un de mes articles précédents , j'avais parlé des DomainDataSource avec RIA Services dans le cas d'une interface Maître - Détail. Dans le même principe, je vais parler d'une autre manière de mettre en forme ce cas d'interface avec RIA Services. Et po...
Cliquez pour lire la suite de l'article par Audrey ZUNE : VERSION ZUNE SOFTWARE V 4.2 ET LA SOCIALISATIONZUNE : VERSION ZUNE SOFTWARE V 4.2 ET LA SOCIALISATION par ROMELARD Fabrice
Une des nouveautés de la version V 3.0 était l'apparition de l'onglet Social qui ne fonctionnait que si le MarketPlace était activé sur son poste. Cela limitait donc son intérêt, car hors du cadre commercial USA-CANADA, peu de monde trouva...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice PRATIQUE DE SILVERLIGHT PAR ERIC AMBROSIPRATIQUE DE SILVERLIGHT PAR ERIC AMBROSI par MPOWARE
Je viens de finir la lecture du dernier livre d'
Eric Ambrosi
éditions PEARSON
Son livre donne une approche pratique de Silverlight qui sera aussi bien comprise par le développeur que par le designeur.
Tous les aspects du développement RIA sont abor...
Cliquez pour lire la suite de l'article par MPOWARE APPRENDRE à DéVELOPPER POUR LES MOBILES AVEC LA NOUVELLE GéNéRATION .NETAPPRENDRE à DéVELOPPER POUR LES MOBILES AVEC LA NOUVELLE GéNéRATION .NET par odewit
2 déclinaisons de Silverlight et 2 déclinaisons de Mono permettent dorénavant (ou permettront prochainement) de développer des applications .NET mobiles pour les principales plates-formes du marché :
Silverlight pour Symbian, basé sur Silverlight 2...
Cliquez pour lire la suite de l'article par odewit ZUNE : NOUVELLE VERSION DU ZUNE SOFTWARE - V 4.2ZUNE : NOUVELLE VERSION DU ZUNE SOFTWARE - V 4.2 par ROMELARD Fabrice
Avec la dernière génération du lecteur MP3 de Microsoft, le ZUNE HD, Microsoft a publié une nouvelle version du logiciel pour PC. Ainsi, je me suis décidé à installer celle-ci sur mon Tablet PC ACER, comme toujours le logiciel est donc tél...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice
Forum
 RE : CONVERSIONRE : CONVERSION par peter2010
Cliquez pour lire la suite par peter2010
Logiciels
 Academy System (10.9.4.0)ACADEMY SYSTEM (10.9.4.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System Xilisoft Convertisseur Vidéo Ultimate (5.1.39.0305)XILISOFT CONVERTISSEUR VIDéO ULTIMATE (5.1.39.0305)Xilisoft Convertisseur Vidéo Ultimate est un outil puissant de conversion vidéo, facile à utilise... Cliquez pour télécharger Xilisoft Convertisseur Vidéo Ultimate Xilisoft DVD Ripper Ultimate (5.0.64.0304)XILISOFT DVD RIPPER ULTIMATE (5.0.64.0304)Xilisoft DVD Ripper Ultimate est un logiciel excellent pour copier et convertir DVD vers presque ... Cliquez pour télécharger Xilisoft DVD Ripper Ultimate Rigs of Rods (63.3)RIGS OF RODS (63.3)c'est un jeu de multi-simulation camions,autobus voitures, avions, bateaux, hélicoptère avec défo... Cliquez pour télécharger Rigs of Rods
|