Pb tableau dynamique

Résolu
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 - 14 sept. 2006 à 09:16
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 - 18 sept. 2006 à 08:28
Bonjour,

J'aimerais créer un tableay dynamique, c'est-à-dire un tableau sans lignes au départ, dans lequel on peut rajouter des lignes vides et écrire dans les cases.

J'ai cherché sur le site et je suis tombé sur des post de forum et sources (notamment une source de Bultez), et je m'en suis inspirée.
Seulement je rencontre des petits problèmes. J'ai trouvé plusieurs codes plus ou moins compliqués, et j'ai donc essayer de faire simple (au cas où quelqu'un retouche après moi) :

<script language="javascript1.3">
            var nbLignes = 0;
           
            function AjoutLigne()
            {
                var nbCellules = 0;
                var newCell;
                nbLignes ++;

                var newRow = document.getElementById('tabFacture').insertRow(-1);
               
                for(nbCellules=0 ; nbCellules<7 ; nbCellules++)
                {
                    newCell = newRow.insertCell(nbCellules);
                    document.getElementById('tabFacture').rows[nbLignes].cells[nbCellules].innerHTML = 'a';
                    document.getElementById('tabFacture').rows[nbLignes].cells[nbCellules].ondblclick = function(){document.getElementById('tabFacture').rows[nbLignes].cells[nbCellules].innerHTML = '';}
                }
            }
</script>
........................
[# Ajouter un repère]
Désignation des ouvrages |Qte |Qte
posée
|P.U.HT
?
|P.T.H.T
?
|%
Fté
|TOTAL
FTE ?
|

En fait, la ligne en rouge pose problème. Je voulais ajouter une fonction sur chaque case quand on double clique dessus (pour laisser apparaître un champ texte permettant de modifier la case), mais en fait il me dit que  document.getElementById('tabFacture').rows[nbLignes].cells[nbCellules] n'a pas de propriétés, alors que je l'ai utilisé dans la ligne d'avant pour ajouter les 'a' dans les cellules !!

Quelqu'un voit ce que j'ai fais de travers ?? Sinon est-ce que je m'y prends bien ou j'utilise pas la bonne méthode pour faire ce que je souhaite ??

En attendant des réponses de votre part (merci d'ailleurs pour les réponses), je continue de chercher

35 réponses

Zobibol Messages postés 469 Date d'inscription mercredi 9 janvier 2002 Statut Membre Dernière intervention 20 février 2017 6
14 sept. 2006 à 09:58
Bien le bonjour, je ne sais pas si ça peu t'aider mais ton traitement sur le ondblclick est faux ;o)
tu ne peux pas récupérer les infos nbLignes et nbCellules comme ça.


le plus simple c'est de faire un traitement plus générique :



document.getElementById('tabFacture').rows[nbLignes].cells[nbCellules].ondblclick  = function (e){
   // Récupère la céllule sur laquelle on à fait double clique 
   var cell = (document.all)? event.srcElement : e.target;
   // ajoute le champs de saisie
   cell.innerHTML = ""


}

Ceci répond-il à ton besoin ?




[o-_-o]
3
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
14 sept. 2006 à 10:54
bonjour,
   tu as raison, dans la fonction qui est associée
      au double click on n'a plus accès ni à nbLignes, ni à nbCellules

   perso je ferais :

     var t=document.getElementById('tabFacture');
     t.rows[nbLignes].cells[nbCellules].ondblclick =
                  function(){this.innerHTML = '';}

<hr />
            cordialement   Bul    mon Site    M'écrire<hr />
3
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
14 sept. 2006 à 11:34
je ne vois pas trop l'intérêt mais ...
( et si j'ai compris ! )

<script type="text/javascript">
function remp(zone,cellule)
{
 cellule.innerHTML=zone;
}
var nbLignes = 0;
function AjoutLigne()
{
 var nbCellules = 0;
    var newCell;
    nbLignes ++;
    var newRow = document.getElementById('tabFacture').insertRow(-1);           
    for(nbCellules=0 ; nbCellules<7 ; nbCellules++)
    {
        newCell = newRow.insertCell(nbCellules);
  var t=document.getElementById('tabFacture');  
        t.rows[nbLignes].cells[nbCellules].innerHTML = 'a';
        t.rows[nbLignes].cells[nbCellules].ondblclick =
   function(){ quoi=this; this.innerHTML = '';}
    }
}
</script>

on doit, sans aucun doute pouvoir faire plus simple !

<hr />
            cordialement   Bul    mon Site    M'écrire<hr />
3
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
16 sept. 2006 à 14:07
je pensais que c'était terminé ici ?
il existe .rowIndex, qui donne le n° de ligne cliquée
un cht'tit exemple ?

<script type="text/javascript">
 function nl(q)
 {
  alert(q.rowIndex);
 }
</script>



onclick="nl(this.parentElement);">1.1, 1.2,
----
onclick=\"nl(this);\">1.1, 1.2

appel différent "bien entendu", si on prend click
( pour l'exemple ! ) sur le td ou le tr





<hr />
      cordialement   Bul    mon Site    M'écrire<hr />et dire que pour une autre manière de faire ....

<script type="text/javascript">
function AjoutLigne()
{
 var tableau=document.getElementById('tabFacture');
    var newRow = tableau.insertRow(-1);  
    for(nbCellules=0 ; nbCellules<7 ; nbCellules++)
    {
        tableau.rows[tableau.length-1].insertCell[nbCellules];
  tableau.rows[tableau.length-1].cells[tableau.indexRows.cells.length].innerHTML =
   '';
    }
}
</script>
[# Ajouter un repère]
 ----
Désignation des ouvrages |
  Qte |
  Qte
posée
|
  P.U.HT
?
|
  P.T.H.T
?
|
  %
Fté
|
  TOTAL
FTE ?
|

par exemple. ou tout autre "jeu" dans style sur onmouse? ou autre....
3

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 10:03
Ouaisssss :) Ca marche, par contre au risque d'être chiante, tu peu m'expliquer un peu ? Parce que j'ai pas tout compris ...

(document.all)? event.srcElement : e.target; --> Ca veut dire quoi ça au juste (je me doute que tu récupère la cellule qui a générer l'évènement, mais c'est la syntaxe que j'ai pas trop compris)

Sinon merci pour la rpéonse :)
0
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 10:05
Et j'ai oublié, pourquoi c'est faux exactement ?? Parce que je suis dans une fonction et donc j'ai plus accès à document.getElementById('tabFacture').rows[nbLignes].cells[nbCellules] ?? (surtout  nbLignes et nbCellules ?? ) Ou je dis n'importe quoi ?
0
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 11:08
Ca marche aussi :)
Par contre si je veux mettre un onBlur sur le input pour que quand on sort du input, la valeur qui y a été saisie soit écrite dans la case (en supprimant le input, donc je retourne à une case normale), comment je fais pour dire que c'est telle case ??

this.innerHTML = '

J'ai essayé de lui passer directement la case mais ça marche pas (comme je m'en étais douté ), mais je trouve pas comment faire. Je sais pas si on peut accéder à la case à partir du input ...
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
14 sept. 2006 à 11:18
this.value, là, fonctionne parfaitement.
      t.rows[nbLignes].cells[nbCellules].ondblclick =
               function(){this.innerHTML = '';}
mis onclick pour le test
onblur n'est activé, avec IE, que si on clique ailleurs sur la page
sinon, voir la fonction afficheSaisie ?
<hr />
            cordialement   Bul    mon Site    M'écrire<hr />
0
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 11:22
Oups, ben en fait dans afficheSaisie, je voulais que ma case qui contienne le input, ne contiennent plus que la saisie (donc on voit plus le input, mais on voit la valeur de ce qui a été saisie dedans, en gros on repasse en case normale).
0
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 11:23
Erf, j'ai oublié de dire des choses :p

En fait dès que l'on quitte la case, on la réaffiche normalement avec ce qu'on vient de saisir (d'où le passage en paramètre de this.value pour avoir la valeur), mais après j'arrive pas à y mettre dans la case (je vois pas comment la passer en paramètre).
Peut-être y'a une autre solution?
0
syndrael Messages postés 2378 Date d'inscription lundi 4 février 2002 Statut Membre Dernière intervention 29 décembre 2012 20
14 sept. 2006 à 11:28
En tout cas, si tu débute, tu rentres directement dans le bain.

Kan ce sera fini, y'aurait moyen d'avoir une démo ?? C'est un oeuvre collective ça !! LOL

S.
0
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 11:31
Si je débutes en quoi ? En prog ?? Euh non, mais bon je suis loin d'en savoir autant que certains, et puis ce truc de tableau, jamais fait lol

Mais sinon mon truc risque pas d'être une merveille lol sauf pour la personne qui va l'utiliser (c'est déjà pas mal hein !)
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
14 sept. 2006 à 11:51
   et si j'ai compris, si la réponse est ok,
pourrait-on savoir pourquoi vouloir faire ça ?
<hr />
                              cordialement   Bul    mon Site    M'écrire<hr />
0
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 13:48
Bon alors j'ai pas encore essayé, mais sinon c'est pour faire une sorte d'excel ...

Un peu dans ce style (test la démo) : http://www.j0k3r.net/news-edition-inline-de-plusieurs-donnees-en-ajax-1477.html

Mais je voudrais y faire sans ajax, mais je voudrais le même principe pour le remplissage du tableau ... Tu vois mieux ce que je veux ??
Maintenant je vais tester ta réponse
0
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 13:53
Alors je vois que t'as tout à fait compris, puisque ta solution marche :)

Moi j'essayais de passer directement le this dans la fonction et comme ça marchait pas, je me suis dis que le récupéré avant ça servirait pas à grand chose !! Ben même pas vrai lol
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
14 sept. 2006 à 13:56
je n'ai pas été très clair ( comme souvent ! )  ma question était :
pourquoi, dans une cellule, mettre un texte...
qui sera remplacé par un input...
lui-même reremplacé par un texte ?
pourquoi ne pas simplement mettre, d'entrée, un input text ?
et le laisser ! par exemple !
<hr />
            cordialement      Bul       mon Site       M'écrire<hr />
0
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 13:59
Ah ok désolée j'avais mal compris!

Parce que la personne va être amenée à changer les données etc etc, données enregistrées dans une base de données.
Donc la première fois, c'est sûr le tableau est vide, mais quand elle revient, il est rempli, et là elle peut changer des choses ...
C'est pour ça. C'est pas une bonne idée mon truc  ?? (même si c'est pas une idée de moi lol)
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
14 sept. 2006 à 14:08
quand au souci avec this...
this c'est "l'objet sur lequel on est", donc
function(){  this... = '';}

            this   c'est la cellule

            this   c'est l'input text


<hr />
            cordialement   Bul    mon Site    M'écrire<hr />
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
14 sept. 2006 à 14:09
>>C'est pas une bonne idée mon truc  ??

pourquoi ne pas simplement mettre, d'entrée, un input text  ??



<hr />
cordialement   Bul    mon Site    M'écrire<hr />
0
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
14 sept. 2006 à 14:12
Hmm ok merci :) je me doutais, mais j'ai essayé de tricher en mettant des + pour voir si il prenait l'autre this lol enfin bref :) ça marche niquel !!

Et pour te donner plus de précision, le fait que l'input soit pas toujours visible, c'est pour éviter le fait que ça incite à la modification lol

En tout cas merci pour vos réponses même si je suis loin d'avoir fini !! :)
0
Rejoignez-nous