begin process at 2012 05 29 20:40:59
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

JavaScript et le navigateur

 > 

Autre

 > 

Problème d'affichage tableau dynamique sous FF


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

Problème d'affichage tableau dynamique sous FF

vendredi 22 décembre 2006 à 13:10:14 | Problème d'affichage tableau dynamique sous FF

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 sous Internet Explorer c'est parfait) ?
(si il y a d'autres remarques concernant mon code, à par que tout est regroupé dans un seul fichier, je suis preneur)

<script language="JavaScript">
<!--
var nb_lignes_DI;
var cptr_lignes;
var tbody_lignes_DI;
var tableau_lignes_DI = new Array(50);
for(var l=0; l<50; l++)
 tableau_lignes_DI[l] = new Array(5);

function init()
{
 tbody_lignes_DI = document.getElementById('tbody_lignes_DI');
 cptr_lignes = 0;
 nb_lignes_DI = 0;
 
}


function change(){           
    var choix = document.getElementById('choix');
    if(choix.value == 'affiche_pas')
     for(var k=0;k<nb_lignes_DI;k++)
     {
         var ligne = document.getElementById(tableau_lignes_DI[k][0]);
            ligne.style.display = 'none';
        }
    if(choix.value == 'affiche')
     for(var k=0;k<nb_lignes_DI;k++)
        {
            var ligne = document.getElementById(tableau_lignes_DI[k][0]);
            ligne.style.display = 'block';
        }
}

function ajouter_ligne()
{
 // ajout de la ligne au tableau
 tableau_lignes_DI[nb_lignes_DI][0] = "ligne"+cptr_lignes;
 tableau_lignes_DI[nb_lignes_DI][1] = "ceci est la description n"+cptr_lignes;
 tableau_lignes_DI[nb_lignes_DI][2] = 1000;
 tableau_lignes_DI[nb_lignes_DI][3] = 1;
 tableau_lignes_DI[nb_lignes_DI][4] = tableau_lignes_DI[nb_lignes_DI][2]*tableau_lignes_DI[nb_lignes_DI][3];
 
 // création de la nouvelle ligne
 var nouvelle_ligne = document.createElement("tr");
 nouvelle_ligne.setAttribute("id",tableau_lignes_DI[nb_lignes_DI][0]);
 nouvelle_ligne.style.display = "block";
 
  // description
     nouvelle_cellule = document.createElement("td");
     text_cellule = document.createTextNode(tableau_lignes_DI[nb_lignes_DI][1]);
     nouvelle_cellule.setAttribute("align","left","false");
     nouvelle_cellule.appendChild(text_cellule);
     // ajout de la cellule description à la ligne
     nouvelle_ligne.appendChild(nouvelle_cellule);
    
     // prix unitaire
     nouvelle_cellule = document.createElement("td");
     text_cellule = document.createTextNode(tableau_lignes_DI[nb_lignes_DI][2]+" €");
     nouvelle_cellule.setAttribute("align","right","false");
     nouvelle_cellule.appendChild(text_cellule);
     // ajout de la cellule prix unitaire à la ligne
     nouvelle_ligne.appendChild(nouvelle_cellule);
    
     // quantité
     nouvelle_cellule = document.createElement("td");
     text_cellule = document.createTextNode(tableau_lignes_DI[nb_lignes_DI][3]);
     nouvelle_cellule.setAttribute("align","right","false");
     nouvelle_cellule.appendChild(text_cellule);
     // ajout de la cellule quantité à la ligne
     nouvelle_ligne.appendChild(nouvelle_cellule);
    
     // prix
     nouvelle_cellule = document.createElement("td");
     text_cellule = document.createTextNode(tableau_lignes_DI[nb_lignes_DI][4]+" €");
     nouvelle_cellule.setAttribute("align","right","false");
     nouvelle_cellule.appendChild(text_cellule);
     // ajout de la cellule prix à la ligne
     nouvelle_ligne.appendChild(nouvelle_cellule);
     
     // supprimer
     nouvelle_cellule = document.createElement("td");
     lien = document.createElement("a");
     lien.setAttribute("href","javascript:supprimer_ligne(\"tbody_lignes_DI\",\""+tableau_lignes_DI[nb_lignes_DI][0]+"\")");
     text_cellule = document.createTextNode("suppr");
     lien.appendChild(text_cellule);
     nouvelle_cellule.appendChild(lien);
     nouvelle_cellule.setAttribute("align","center","false");
     // ajout de la cellule supprimer à la ligne
     nouvelle_ligne.appendChild(nouvelle_cellule)
    
    
    // ajout de la ligne au tableau
    tbody_lignes_DI.appendChild(nouvelle_ligne);
   
    cptr_lignes++;
    nb_lignes_DI++;
}

function supprimer_ligne(parent, child)
{
 // suppression dans le tableau html
 var obj = document.getElementById(parent);
 var old = document.getElementById(child);
 obj.removeChild(old);

 // suppression dans le tableau javascript
 for(var l=0; l<nb_lignes_DI; l++)
 {
  if(tableau_lignes_DI[l][0]==child)
  {
   for(l;l<(nb_lignes_DI-1);l++)
   {
    tableau_lignes_DI[l][0]=tableau_lignes_DI[l+1][0];
    tableau_lignes_DI[l][1]=tableau_lignes_DI[l+1][1];
    tableau_lignes_DI[l][2]=tableau_lignes_DI[l+1][2];
    tableau_lignes_DI[l][3]=tableau_lignes_DI[l+1][3];
    tableau_lignes_DI[l][4]=tableau_lignes_DI[l+1][4];
   }
   nb_lignes_DI--;
   break;
  }
 }
}
// -->
</script>

<html>
<head>
<title></title>
</head>

<body onload="init()">

<select style="width:265px;" id="choix" name="liste_choix" onchange="change()">
 <option value="affiche" selected="selected">Afficher</option>
 <option value="affiche_pas">Ne pas afficher</option>
</select>

<CENTER>
<TABLE width=80% border=0 cellspacing=1 cellpadding=5>
 <thead id="thead_lignes_DI">
 <TR id="ligne_entete" style="display:block">
  <TD align=center width=50% bgcolor=#006699><FONT color=#FFFFFF>Description</FONT></TD>
  <TD align=center width=15% bgcolor=#006699><FONT color=#FFFFFF>Prix unitaire</FONT></TD>
  <TD align=center width=10% bgcolor=#006699><FONT color=#FFFFFF>Quantité</FONT></TD>
  <TD align=center width=15% bgcolor=#006699><FONT color=#FFFFFF>Prix</FONT></TD>
  <TD align=center width=10% bgcolor=#006699><FONT color=#FFFFFF>Suppression</FONT></TD>
 </TR>
 </thead>
 <tbody id="tbody_lignes_DI">
 </tbody>
</TABLE>
</CENTER>
<INPUT TYPE=button NAME=ajouter VALUE="Ajouter" onclick="ajouter_ligne()"><br>
  
</body>
</html>


Merci d'avance

vendredi 22 décembre 2006 à 14:27:39 | Re : Problème d'affichage tableau dynamique sous FF

roro06



Bonjour

Oui, ce sont tes display:block qui causent soucis

Cordialement
Roro webDev
vendredi 22 décembre 2006 à 14:49:10 | Re : Problème d'affichage tableau dynamique sous FF

DMK04

Merci pour ta réponse,

j'ai changé le display:block par visibility:visible et none par hidden. Ca m'a enlevé un bug sous FF, ça a modifier un peu sous IE aussi (mais rien d'anormal, quand je fait ne pas afficher on voit un blanc parce que l'on cache, alors qu'avec display:none il tassait).
Sous FF il me reste toujours les "bug" suivant :
- les textes ne sont pas dans les bonnes colonnes (tout entassé au debut de la ligne)
- lorsque je supprime un élément, c'est comme si je l'avait caché, le tableau ne se retasse pas, il reste une ligne blanche...)

Merci


Cette discussion est classée dans : ligne, tableau, lignes, cellule, di


Répondre à ce message

Sujets en rapport avec ce message

supprimer lignes d un tableau [ par era ] bon, voila je cherche a cache des lignes d un tableau html, sans que la place reste priseje passe par document.getElementById("laligne").style.visibil verifier le contenu d'une cellule dans un tableau [ par oppossom ] bonjour tous je vais entrer directement dans le vif du sujet mon soucis est :est que la ligne et la cellule d'un tableau sont des objets javascript ?e Créer cellule td dans un tableau html [ par mike1310 ] Bonjour,J'ai un probleme de compatibilité entre IE et Mozilla (le truc super rare !!! ).Mon probleme lors d'un clic, sur un bouton, je dois pouvoir aj imprimer des lignes dans un tableau [ par oummm ] salut, j'extrait d'une base de donnee Mysql des informations que je regroupe dans un tableau. chaque ligne de ce tableau representant 1 enregistrement changer l'image d'une cellule d'un tableau au passage de la souris sur le ligne [ par lezj ] bonjour à toutes et à tous. je suis handicapé dans une application par un petit problème: j'ai un tableau généré dynamiquement (par un foreach php Ajout/suppression d'un champ input type -> Problème de récupération du tableau $_POST [ par alaska749 ] Bonjour, j'ai récupérer le script js ci-dessous permettant d'ajouter ou supprimer des input type text... ce script fonctionnne très bien mais je n'arr Suppression d'une ligne d'un tableau js [ par alaska749 ] Bonsoir, Après avoir souffert pour créer une simple table dynamique en javascript, je doit maintenant pouvoir supprimer n'aimporte quelle ligne de ce Supprime toujours la dernière ligne du tableau ? [ par alaska749 ] Bonsoir, J'ai ré-adapté un code trouvé afin qu'il m'initialise et me crée à chaque appel de la fonction, un tableau dynamique en fonction d'une chain Accéder aux lignes d'un tableau (JavaScript) depuis le code behind(C#) [ par MathieuDev ] Bonjour à tous, je fais appel à codes-sources.com car je rencontre un problème sur mon application web. En effet, j'ai construit un tableau html vide Parcours d'un tableau en JS [ par Canyata ] Bonjour à tous [^^happy17] J'ai une question à vous poser. J'ai un tableau en HTML sur ma page: [code=php]echo""; echo""; echo""; echo"";


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
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 : 4,976 sec (3)

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