begin process at 2010 03 22 05:29:56
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

JavaScript et le navigateur

 > 

Fonctionnement d'une propriété d'un navigateur

 > 

Creation dynamique d'un tableau en HTML


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

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

Membre Club
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

Membre Club

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.


mnu.bmp stefou.bmp
STFOU
lundi 16 avril 2007 à 18:48:57 | Re : Creation dynamique d'un tableau en HTML

stfou

Membre Club
OOOups, il fallait lire tableau.insertRow(i);


mnu.bmpstefou.bmp
STFOU
lundi 16 avril 2007 à 19:41:21 | Re : Creation dynamique d'un tableau en HTML

PetoleTeam

Membre Club
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

Membre Club
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

Membre Club

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

AllalcoolG

Merci je la teste demain


Cette discussion est classée dans : dynamique, tableau, lignes, html, creation


Répondre à ce message

Sujets en rapport avec ce message

Ajout de lignes dans un tableau dynamique a l'aide d'un bouton [ par raven44 ] Je possède deux formulaires, le premier dispose d'information recherché dans une base mysql, sur ce formulaire je dispose également d'un bouton de com Tri de colonnes d'un tableau html grâce à un js [ par ebenedzer ] SalutJe n'arrive pas à trouver comment je peux trier les colonnes d'un tableau fait en html, à l'aide d'un javascript.Est-ce que je dois mettre des ba valeurs de formulaire 'select' dynamique [ par DarkTiteuf ] Voila bonsoir j'ai le cas suivant : et je voudrais que lorsque je clique sur une valeur a gauche cela change le tableau de droite. La propriété onch afficher 10 lignes [ par Dellys ] BonjourVoila j'ai une boucle qui affiche des enregistrement sur un tableau ,ce que je veut c'est que méme si il ya moins de 10 enregistremts le tablea extraire un tableau HTML..et l'exporter sur un tableur [ par POMDORAK ] ..bonjour ..bonjour.. ..voilà..je viens humblement sur ces pages pour rechercher un peu d'aide.. ..Terriblement accroché à un jeu Online..de simulat Imprimer tableaui html sur plusieurs pages sans couper le tableau pour une facture [ par goldstrike93 ] Bonjour a tous, j'ai un petit problème que je n'arrive pas a résoudre depuis un moment.Je travail sur un logiciel intranet en php de facturation et je exportation tableau html vers excel [ par kedieng ] Slt j'aimerai pouvoir exporter un tableau html en excel mais je ne sais pas comment faire. Si quelqu'un peut m'aider.Merci creation de menu dynamique avec une servlet? [ par youra2005 ] Problème d'affichage tableau dynamique sous FF [ par DMK04 ] Bonjour,Est-ce que quelqu'un pourrait me dire si il y a une erreur quelconque qui pourrait causer des problèmes d'affichage sous FireFox (alors que so liens dans une feuille de style [ par phelsuma ] Salut tout le monde,Ce topic fait suite à celui-ci :  http://www.javascriptfr.com/infomsg_INTEGRER-HT


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Mars 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728
293031    

Consulter la suite du CalendriCode

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,250 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales