Affecter une fonction à une cellule d'un tableau

Résolu

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 - 17 janv. 2007 à 17:19
cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 - 29 janv. 2007 à 16:29

Bonjour,

J'ai un tableau HTML où je créer des lignes dynamiquement grâce au javascript.
Seulement pour certaines cellules, j'ai besoin d'affecter des fonction.

Normalement quand la cellule existe déjà (elle n'est donc pas créée dynamiquement), je la récupère de cette manière : <TD ondblClick="javascript:changeEtatCase(this);">

J'ai donc besoin pour les celulles créées dynamiquement d'affecter le ondlClick.
Je crée ma ligne comme ça : newRow = window.parent.opener.document.getElementById("monTab").insertRow((window.parent.opener.document.getElementById("montant").rowIndex)-1);
Ensuite je fais ma cellule : newCell = newRow.insertCell(1);

Mais comment affecter la fonction ensuite ?

Merci

A voir également:

32 réponses

Réponse 21 / 32

PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
25 janv. 2007 à 18:28

B
onjour à tous...

J'ai charger tes fichiers et une première reflexion à leur lecture me viens :

la méthode "Obj.innerHTML = Quelquechose" est moyenne quand il s'agit d'objet lourd, en gestion par le navigateur sentant, comme les INPUT, TEXTAREA ou autres, il est préférable de jouer avec Parent. appendChild ( O_New);
exemple pour ta function changeEtatCase(cellule)

//-------------------------------
function changeEtatCase(cellule){
var element = cellule;

//On récupère la cellule qui a été double-cliquée

// element.innerHTML = ''; //Affichage d'un champ text pour la saisie

var O_New = document.createElement('input');

// Creation de l'objet input

O_New.id = "saisie";
O_New.ondblclick = function(){alert("Désolé déjà Crée..!");} // Pour le FUN
element.appendChild( O_New);

// Ajout de l'élement

element.ondblclick = function(){return(false)};

// Evite une recréation

O_New.focus();

// La normalement il est crée



alert(element.innerHTML);

                       // pour tester la différence

// setTimeout(function(){document.getElementById('saisie').focus();},1000);

}

En espérant faire avancer un petit peu les choses...
;0)

Réponse 22 / 32

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
26 janv. 2007 à 08:27

Merci pour ta réponse. Je ne connaissais pas cette méthode.

Mais alors comment je fais quand j'ai déjà quelque chose dans la cellule et que je veux l'écraser ?

Exemple :
cellule.innerHTML = '' + valeur;
Normalement dans cellule.innerHTML, il y a déjà :

L'input est déjà existant, mais on veux lui mettre la nouvelle valeur affectée, et en plus de cela l'afficher dans la case (la case contient donc un input caché et du texte au final).
Parce que je pourrais mettre directement la valeur à l'input, mais après comment je mets du texte sans écraser l'input ?? J'ai pas trouvé d'autre solution que de tout réécraser et recréer. Et là si je fais comme toi, ça va juste m'ajouter un input de plus et du texte, alors j'aurais un input de trop ...

J'espère avoir été claire.

Merci

Réponse 23 / 32

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
26 janv. 2007 à 08:52

Je reviens à la charge car j'essaye de reprendre toutes les fonctions javascript pour mettre en place ce que tu m'as dis mais je rencontre des problèmes

Pour créer une ligne dynamiquement, j'ai fait :
newRow = window.parent.opener.document.getElementById("tabFacture").insertRow((window.parent.opener.document.getElementById("montantHT").rowIndex)-1);
    newRow.id = 'infoRep|' + unIdentifiant;

    var cell1 = document.createElement("td");
    var cell1_Text = document.createTextNode(uneDesignation);
    cell1.appendChild(cell1_Text);

    var cell2 = document.createElement("td");
    var cell2_Text = document.createTextNode(uneQte);
    cell2.appendChild(cell2_Text);

    var cell3 = document.createElement("td");
    cell3.headers = "qtePosee";
    var cell3_Text = document.createTextNode("");
    cell3.appendChild(cell3_Text);
    cell3.ondblclick = function(){changeEtatCase(this);};

    var cell4 = document.createElement("td");
    var cell4_Text = document.createTextNode(unPUHT);
    cell4.appendChild(cell4_Text);

    var cell5 = document.createElement("td");
    cell5.headers = "fte";
    var cell5_Text = document.createTextNode("");
    cell5.appendChild(cell5_Text);

    var cell6 = document.createElement("td");
    var cell6_Text = document.createTextNode("");
    cell6.appendChild(cell6_Text);

    var cell7 = document.createElement("td");
    var cell7_Text = document.createTextNode("");
    cell7.appendChild(cell7_Text);
Et finalement, ben sous Firefox ma ligne est bien créée (le ondblclick ne fonctionne toujours pas), mais sous IE la ligne ne se crée pas Enfin on voit qu'il a essayé de la rajouté, parce que là où elle aurait du être créée, la bordure de séparation avec la ligne du dessus est doublée, mais il ne met rien à l'intérieur. Je vois pas pourquoi, j'ai fait comme ce que j'avais trouvé sur selfHTML, ou alors j'ai pas fais gaffe et j'ai fait une belle connerie

Merci

Réponse 24 / 32

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
26 janv. 2007 à 08:56

Oups désolée pour l'écriture du post précédent : dommage qu'on puisse pas éditer ...

J'ai oublié de metter en fin de code :
    newRow.appendChild(cell1);
    newRow.appendChild(cell2);
    newRow.appendChild(cell3);
    newRow.appendChild(cell4);
    newRow.appendChild(cell5);
    newRow.appendChild(cell6);
    newRow.appendChild(cell7);
Voilà merci de votre éventuelle aide

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

Posez votre question

Réponse 25 / 32

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
26 janv. 2007 à 09:23

Désolée de multiplier les post, j'ai trouvé la solution à mes deux derniers posts, j'avais oublié de spécifier que c'était le document qui avait ouvert la fenêtre de création qu'il fallait ajouter les éléments.

Par contre ma question sur le remplacement du contenu d'une cellule est toujours d'actualité.

Merci

Réponse 26 / 32

PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
26 janv. 2007 à 11:55

B
onjour...
pour effacer le contenu il suffit de rajouter un removeChild

La fonction devient
//-------------------------------
function changeEtatCase(cellule){
var element = cellule; //On récupère la cellule qui a été double-cliquée
// -- Supprime tous les Enfants
while (element.firstChild) {
    element.removeChild(element.firstChild);
}
//-- Maintenant création

var O_New = document.createElement('input');
O_New.id = "saisie";
O_New.ondblclick = function(){alert("Désolé déjà Crée..!");}
element.appendChild( O_New);
// Ajout de l'élement
element.ondblclick = function(){return(false)};
// Evite une recréation
O_New.focus();
// La normalement il est crée

}

;0)

Réponse 27 / 32

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
26 janv. 2007 à 14:47

Merci beaucoup. J'avais pas utilisé ça

Maintenant, j'ai refais tout mon fichier javascript (épuré pour els tests) avec ce que tu as dis, donc je fais plus de innerHTML=....
Mais ça ne résoud pas mon problème malheureusement

Quand je crée une ligne dynamiquement, et que je double clique dans la troisème case, ça ne marche pas. La console javascript de firefox me dis que changeEtatCase (la fonction censée être appelée au double-clic) n'est pas définie.

Je ne trouve toujours pas pourquoi mais je continue de chercher !

Merci pour votre aide !

Réponse 28 / 32

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
26 janv. 2007 à 15:47

J'ai essayé avec addEventListener plutôt que ondblclick=... , mais ça ne marche pas

Je cherche, je cherche ...

Réponse 29 / 32

PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
26 janv. 2007 à 15:50

Je te livre un truc qui marche...
...chez moi...

//------------------------------

function changeEtatCase(cellule){
var element = cellule; //On récupère la cellule qui a été double-cliquée
// -- Supprime tous les Enfants
while (element.firstChild) {
element.removeChild(element.firstChild);
}

//-- Maintenant création
var O_New = document.createElement('input');
O_New.id = "saisie";
O_New.ondblclick = function(){alert("Désolé déjà Crée..!");}
element.appendChild( O_New);
// Ajout de l'élement
element.ondblclick = function(){return(false)}; // Evite une recréation
O_New.focus(); // La normalement il est crée
}

avec la fonction ajoutLigne, la on peut utiliser innerHTML car c'est du texte
//-----------------------------------------------------------------------
function ajoutLigne( uneDesignation, unTypeElt, unIdentifiant, uneQte, unPUHT){
var newCell;
var newRow;

var table = FindID("tabFacture");
var position = FindID("montantHT").rowIndex;
var newRow = table.insertRow(position);
newRow.id = 'infoRep|' + unIdentifiant;

var cell1 = newRow.insertCell(0);
cell1.className = "left";
cell1.innerHTML = uneDesignation;

var cell2 = newRow.insertCell(1);
cell2.innerHTML = uneQte;

var cell3 = newRow.insertCell(2);
cell3.headers = "qtePosee";
cell3.innerHTML = "???";
cell3.ondblclick = function(){changeEtatCase(this);};

var cell4 = newRow.insertCell(3);
cell4.innerHTML = unPUHT;

var cell5 = newRow.insertCell(4);

var cell6 = newRow.insertCell(5);
cell6.headers = "fte";
cell6.innerHTML="6"
cell6.ondblclick = function(){changeEtatCase(this);};

var cell7 = newRow.insertCell(6);
cell7.headers="totalFTE"
cell7.innerHTML="totalFTE"
}

j'avoue que j'ai rajouté un bouton sur la page test.htm pour générer les lignes et je n'ai aucun probléme...

;0)

Réponse 30 / 32

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
26 janv. 2007 à 16:11

J'ai recopié tes fonctions mais il continue de me dire que changeEtatCase n'est pas définie Je comprend pas pourquoi il veut pas !! D'ailleurs j'ai du mettre un setTimeout pour le onFocus de changeEtatCase, parce qu'avec le while et ben IE ne donne plus le focus ...

Ca commence vraiment à m'énerver là

Merci quand même.

Réponse 31 / 32

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
26 janv. 2007 à 16:25

C'est vrai qu'en faisant un bouton qui appelle directement la fonction qui ajoute une ligne en lui donnant des paramètres en dur, et bien ça marche

Je vois pas la différence ... Ca revient au même au final !

Réponse 32 / 32

cs_chamallow Messages postés 363 Date d'inscription mercredi 18 mai 2005 Statut Membre Dernière intervention 29 janvier 2007 1
29 janv. 2007 à 16:29

J'ai bien fais de te demander
Effectivement ça marche nickel maintenant !! Après une semaine de recherches qui tapent sur le système, ça fait du bien de voir que ça marche.

Je saurais pour la prochaine fois en tout cas, car je me doutais vraiment pas de ça !

En tout cas merci beaucoup

Discussions similaires

[vba] recopier la valeur d'une cellule dans une autre feuille.

Comment appeler une cellule d'une autre feuille

Prendre la valeur d'une cellule dans excel avec vba

Couleur de fond d'une cellule excel

ecrire le contenu d'une variable dans une cellule excel

Votre réponse

Discussions similaires