IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Ajouter une ligne à un tableau (adaptation d'un script existant)


Sujet :

JavaScript

  1. #1
    Membre éprouvé
    Avatar de beegees
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mars 2004
    Messages
    3 610
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 48
    Localisation : Belgique

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Enseignement

    Informations forums :
    Inscription : Mars 2004
    Messages : 3 610
    Points : 1 277
    Points
    1 277
    Par défaut Ajouter une ligne à un tableau (adaptation d'un script existant)
    Bonjour tout le monde,

    J'ai un tableau, j'aimerais avec javascript y ajouter une ou plusieurs lignes.

    Avant de poster, j'ai fais une recherche sur le forum et j'ai trouvé ce super code :

    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
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Document sans nom</title>
     
    <script type="application/javascript">
    	function Addcolonne(position){
    		//récupération des lignes du tableau pour ajouter une cellule à chacune
    		var MesLignes = document.getElementById('toto').getElementsByTagName("tr");
    		var LastCelulle = document.getElementById('toto').getElementsByTagName("tr")[0].getElementsByTagName("td").length;
    		for(var i = 0 , l = MesLignes.length; i < l ; i++){
    			if(position == "debut"){
    			//si on veux ajouter la célulle au début :
    				var newCell = MesLignes[i].insertCell(0);
    				newCell.innerHTML = 'nouvelle célulle';
    			}
    			else{
    			// pour ajouter la "colonne a la fin : "
    				var newCell = MesLignes[i].insertCell(LastCelulle);
    				newCell.innerHTML = 'nouvelle célulle';
    			}
    		}
    	}
    </script>
    </head>
     
    <body>
     
    <table width="200" border="1" id="toto">
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
    </table>
    <input type="button" value="ajouter au début" onclick="Addcolonne('debut')" />
    <input type="button" value="ajouter a la fin" onclick="Addcolonne('fin')" />
    </body>
    </html>
    Ce code écrit par "le chomeur" permet d'ajouter une colonne en début ou en fin de tableau.

    Moi ce que j'aimerais faire, c'est ajouter une ligne en fin de tableau.

    Est-il possible d'adapter ce code pour ajouter une ligne au tableau ?

    Merci d'avance.

    beegees

  2. #2
    Rédacteur
    Avatar de bigboomshakala
    Homme Profil pro
    Consultant Web .NET
    Inscrit en
    Avril 2004
    Messages
    2 077
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Val de Marne (Île de France)

    Informations professionnelles :
    Activité : Consultant Web .NET
    Secteur : Finance

    Informations forums :
    Inscription : Avril 2004
    Messages : 2 077
    Points : 2 757
    Points
    2 757
    Par défaut
    la réponse est dans la FAQ Javascript

  3. #3
    Membre éprouvé
    Avatar de beegees
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mars 2004
    Messages
    3 610
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 48
    Localisation : Belgique

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Enseignement

    Informations forums :
    Inscription : Mars 2004
    Messages : 3 610
    Points : 1 277
    Points
    1 277
    Par défaut
    Citation Envoyé par bigboomshakala Voir le message
    la réponse est dans la FAQ Javascript
    Salut,

    Merci pour ta réponse.

    En effet, le script est très intéressant, merci.

    Deux petits problèmes maintenant :

    1) La hauteur des lignes créés est trop petite car j'ai retiré [nouvelle cellule 0], y'a-t'il moyen de donner la valeur de la hauteur de la cellule ?
    2) il ne crée que deux nouvelles cellules, le script devrait créer le nombre de cellule se trouvant dans la table appelée par la liste déroulante

    Pour ce qui est du problème numéro 2, je calcule le nombre de champ de la table avec mysql_num_fields($query) ce qui me retourne le nombre de champs.

    Je vais ensuite mettre dans un while la création des cellules.

    Un tout grand merci pour l'aide.

    beegees

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Ajouter une ligne à un tableau
    Par remrem13 dans le forum Général JavaScript
    Réponses: 10
    Dernier message: 16/04/2009, 16h45
  2. Réponses: 8
    Dernier message: 21/10/2008, 10h15
  3. [DOM] Ajouter une ligne à un tableau
    Par Arnard dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 13/04/2007, 09h59
  4. Ajouter une ligne à un tableau
    Par frog43 dans le forum Général JavaScript
    Réponses: 7
    Dernier message: 19/03/2007, 14h39
  5. Ajouter une ligne à un tableau
    Par Oluha dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 16/02/2005, 15h20

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo