Modifier le paramètre d'une fonction appelé par onclick dans un layer

Signaler
Messages postés
13
Date d'inscription
mercredi 21 janvier 2004
Statut
Membre
Dernière intervention
16 juin 2006
-
Messages postés
13
Date d'inscription
mercredi 21 janvier 2004
Statut
Membre
Dernière intervention
16 juin 2006
-
J'ai un layer dont le cellules peuvent évoluer en valeur et aussi sur le paramètre de la fonction qui est appelée.
- lors de la création du layer le onclick fonctionne bien
- lorsque que je modifie les valeurs des cellules, il n'y a pas de problème, mais lorsque je modifie l'attribut onclick pour changer la valeur du paramètre à passer à la fonction (recup), alors les cellules ne click plus:

Voici un petit exemple de mon problème:

<html>


<head>


<style>


#csscontrole { HEIGHT: 105px; LEFT: 200px; BORDER: #000000 thin solid; POSITION: absolute; TOP: 20px; VISIBILITY: hidden; WIDTH: 20px; Z-INDEX: 1;}


</style>


<script language="JavaScript">


oTop=16;


oLeft=30;


var controle = new Controle();


function Controle() {


//alert("toto");


}


Controle.calculer = function() {


// fabrication du controle


html = "
";


html += "\";

html += \"----
A, \";

html += \"----
B, \";

html += \"</td>\";

html += \"----
C, \";

html += \"----
D, \";

html += \"</td>\";

html += \"----
";

html += ", \";

html += "

";


document.write(html);


document.all.csscontrole.style.visibility='hidden';


}


Controle.maj = function() {


// racine est le noeud TBODY dont les lignes du tableau sont les childNodes


var racine = document.getElementById("tidcontrole").lastChild;


var iligne = 0;


var ligne = racine.childNodes[iligne];


var cell = ligne.firstChild;


// modification des cellules


cell = ligne.childNodes[0];


var ch_var_long = "recup("E");";


cell.firstChild.nodeValue = "E";


//alert(cell.attributes["onclick"].nodeValue);


cell.removeAttribute("onclick");


//cell.attributes["onclick"].nodeValue = ch_var_long;


//cell.setAttribute("onClick", ch_var_long);


cell.onclick = ch_var_long;


//alert(cell.attributes["onclick"].nodeValue);


var iligne = 1;


var ligne = racine.childNodes[iligne];


var cell = ligne.firstChild;


cell = ligne.childNodes[0];


var ch_var_long = "recup("F");";


cell.firstChild.nodeValue = "F";


//alert(cell.attributes["onclick"].nodeValue);


cell.removeAttribute("onclick");


//cell.attributes["onclick"].nodeValue = ch_var_long;


//cell.setAttribute("onClick", ch_var_long);


cell.onclick = ch_var_long;


//alert(cell.attributes["onclick"].nodeValue);


var iligne = 2;


var ligne = racine.childNodes[iligne];


var cell = ligne.firstChild;


cell = ligne.childNodes[0];


var ch_var_long = "recup("G");";


cell.firstChild.nodeValue = "G";


//alert(cell.attributes["onclick"].nodeValue);


cell.removeAttribute("onclick");


//cell.attributes["onclick"].nodeValue = ch_var_long;


//cell.setAttribute("onClick", ch_var_long);


cell.onclick = ch_var_long;


//alert(cell.attributes["onclick"].nodeValue);


var iligne = 3;


var ligne = racine.childNodes[iligne];


var cell = ligne.firstChild;


cell = ligne.childNodes[0];


var ch_var_long = "recup("H");";


cell.firstChild.nodeValue = "H";


//alert(cell.attributes["onclick"].nodeValue);


cell.removeAttribute("onclick");


//cell.attributes["onclick"].nodeValue = ch_var_long;


//cell.setAttribute("onClick", ch_var_long);


cell.onclick = ch_var_long;


//alert(cell.attributes["onclick"].nodeValue);


}


function valid(nTop,nLeft,nHaut,nLarg)


{


//alert(document.all.controle.style.visibility);


var nTop=eval(nTop + nHaut + oTop + document.all.tdcontrole.offsetTop);


var nLeft=eval(nLeft + oLeft + document.all.tdcontrole.offsetLeft - document.all.tdcontrole.offsetWidth + nLarg);


document.all.csscontrole.style.pixelTop=nTop;


document.all.csscontrole.style.pixelLeft=nLeft;


document.all.csscontrole.style.visibility='visible';


}


function recup(MaValeur)


{


document.form1.idcontrole.value=MaValeur;


Controle.maj();


document.all.csscontrole.style.visibility='hidden';


}


</script>


</head>




<script language="JavaScript">


Controle.calculer();</script>


<form method=\"POST\" name=\"form1\" action=\"/Asp/test/Test.asp\">

----
Ouvir le contrôle,

, </form>




</html>

Merci pour votre aide

4 réponses

Messages postés
289
Date d'inscription
vendredi 11 mars 2005
Statut
Membre
Dernière intervention
3 avril 2008
4
Salut!

Je te propose d'utiliser l'évenement pour récuperer la valeur de la cellule.

Exemple :


<html>
<head>
<style>
#csscontrole { HEIGHT: 105px; LEFT: 200px; BORDER: #000000 thin solid; POSITION: absolute; TOP: 20px; VISIBILITY: hidden; WIDTH: 20px; Z-INDEX: 1;}
</style>

<script language= "JavaScript">
oTop=16;
oLeft=30;

var controle = new Controle();

function Controle() {

//alert("toto");

}

Controle.calculer = function() {

// fabrication du controle

html = "
";
html += "\";
html += \"----
;
html += " onclick='recup(event);' align='center' style='cursor: hand;'> A, \";
html += \"----
;
html += " onclick='recup(event);' align='center' style='cursor: hand;'> B, \";
html += \"</td>\";
html += \"----
;
html += " onclick='recup(event);' align='center' style='cursor: hand;'> C, \";
html += \"----
;
html += " onclick='recup(event);' align='center' style='cursor: hand;'> D, \";
html += \"</td>\";
html += \"----
";
html += ", \";
html += "

";

document.write(html);

document.all.csscontrole.style.visibility='hidden';

}

Controle.maj = function() {

// racine est le noeud TBODY dont les lignes du tableau sont les childNodes

var racine = document.getElementById("tidcontrole").lastChild;

// modification des cellules
var iligne = 0;
var ligne = racine.childNodes[iligne];
var cell = ligne.firstChild;
cell.firstChild.nodeValue = "E";
cell.onclick = recup;

var iligne = 1;
var ligne = racine.childNodes[iligne];
var cell = ligne.firstChild;
cell.nodeValue = "F";
cell.onclick = recup;

var iligne = 2;
var ligne = racine.childNodes[iligne];
var cell = ligne.firstChild;
cell.nodeValue = "G";
cell.onclick = recup;

var iligne = 3;
var ligne = racine.childNodes[iligne];
var cell = ligne.firstChild;
cell.firstChild.nodeValue = "H";
cell.onclick = recup;

}

function valid(nTop,nLeft,nHaut,nLarg)

{

//alert(document.all.controle.style.visibility);

var nTop =eval(nTop + nHaut + oTop + document.all.tdcontrole.offsetTop);

var nLeft= eval(nLeft + oLeft + document.all.tdcontrole.offsetLeft - document.all.tdcontrole.offsetWidth + nLarg);

document.all.csscontrole.style.pixelTop=nTop;

document.all.csscontrole.style.pixelLeft=nLeft;

document.all.csscontrole.style.visibility='visible';

}

function recup(ev)
{
MaCellule =ev&& ev.target?ev.target:event.srcElement;
MaValeur = MaCellule.firstChild.nodeValue;
document.form1.idcontrole.value=MaValeur;

Controle.maj();

document.all.csscontrole.style.visibility='hidden';

}

</script>

</head>

<script language ="JavaScript">

Controle.calculer();</script>

width=\"250\" class=\"table1\">

<form method=\"POST\" name=\"form1\" action=\"/Asp/test/Test.asp\">

----
width="50%">Ouvir le contrôle,

width="50%" id=tdcontrole>

, </form>

</html>

A+, Ghislain
Messages postés
13
Date d'inscription
mercredi 21 janvier 2004
Statut
Membre
Dernière intervention
16 juin 2006

Bonjour et merci de ta réponse.
Je ne comprends pas bien le fonctionnement de ta solution. Je n'ai jamais utilisé event et target; je vais regarder dans les doc. Est-ce que celà peut me permettre de récupérer dans la fonction récup une valeur qui serait différente de celle qui est affichée dans le TD, et dont le calcul (fait dans la fonction maj) fait qu'il se peut qu'il n'y ait pas de relation.
Effectivement dans le script de test j'ai repris des valeurs identiques, mais dans mon appli elles sont toujours différentes, et je pensais pouvoir éviter de refaire le calcul lors de la récupération de la valeur clickée.
J'avais aussi une autre solution qui était de gérer un tableau caché des valeurs avec le même indice que le tableau affiché?
Qu'en penses-tu.
Je ne suis pas sûr d'avoir été très clair

A+,
Jean-François
Messages postés
289
Date d'inscription
vendredi 11 mars 2005
Statut
Membre
Dernière intervention
3 avril 2008
4
Salut!

Avec un setAttribute et getAttribute, tu devrais trouver ton compte.

A+, Ghislain


<html>
<head>

<style>
#
csscontrole
{
HEIGHT:
105px;
LEFT:
200px;
BORDER:
#000000
thin
solid;
POSITION:
absolute;
TOP:
20px;
VISIBILITY:
hidden;
WIDTH:
20px;
Z-
INDEX:
1;}

</style>

<script language= "JavaScript">
oTop
=16;
oLeft
=30;

var controle
=
new Controle
();

function Controle
()
{

//alert("toto");

}

Controle
.calculer
=
function()
{

// fabrication du controle

html
=
"
";
html
+=
"\";
html
+=
\"----
;
html +=
" onclick='recup(event);' align='center' style='cursor: hand;' value='AAA'> A, \";
html
+=
\"----
;
html +=
" onclick='recup(event);' align='center' style='cursor: hand;' value='BBB'> B, \";
html
+=
\"</td>\";
html
+=
\"----
;
html +=
" onclick='recup(event);' align='center' style='cursor: hand;' value='CCC'> C, \";
html
+=
\"----
;
html +=
" onclick='recup(event);' align='center' style='cursor: hand;' value='DDD'> D, \";
html
+=
\"</td>\";
html
+=
\"----
";
html
+=
", \";
html
+=
"

";

document
.write
(html
);

document
.all
.csscontrole
.style
.visibility
='hidden';

}

Controle
.maj
=
function()
{

// racine est le noeud TBODY dont les lignes du tableau sont les childNodes

var racine
= document
.getElementById
("tidcontrole").lastChild;

// modification des cellules

var iligne
=
0;

var ligne
= racine
.childNodes
[iligne
];

var cell
= ligne
.firstChild;
cell
.setAttribute
("value","EEE");
cell
.firstChild
.nodeValue
=
"E";
cell
.onclick
= recup;

var iligne
=
1;

var ligne
= racine
.childNodes
[iligne
];

var cell
= ligne
.firstChild;
cell
.setAttribute
("value","FFF");
cell
.firstChild
.nodeValue
=
"F";
cell
.onclick
= recup;

var iligne
=
2;

var ligne
= racine
.childNodes
[iligne
];

var cell
= ligne
.firstChild;
cell
.setAttribute
("value","GGG");
cell
.firstChild
.nodeValue
=
"G";
cell
.onclick
= recup;

var iligne
=
3;

var ligne
= racine
.childNodes
[iligne
];

var cell
= ligne
.firstChild;
cell
.setAttribute
("value","HHH");
cell
.firstChild
.nodeValue
=
"H";
cell
.onclick
= recup;

}

function valid
(nTop
,nLeft
,nHaut
,nLarg
)

{

//alert(document.all.controle.style.visibility);

var nTop
=eval
(nTop
+ nHaut
+ oTop
+ document
.all
.tdcontrole
.offsetTop
);

var nLeft
= eval
(nLeft
+ oLeft
+ document
.all
.tdcontrole
.offsetLeft
- document
.all
.tdcontrole
.offsetWidth
+ nLarg
);

document
.all
.csscontrole
.style
.pixelTop
=nTop;

document
.all
.csscontrole
.style
.pixelLeft
=nLeft;

document
.all
.csscontrole
.style
.visibility
='visible';

}

function recup
(ev
)

{
MaCellule
=ev
&& ev
.target?ev
.target
:event
.srcElement;
alert
(MaCellule
.getAttribute
("value"));
MaValeur
= MaCellule
.firstChild
.nodeValue;
document
.form1
.idcontrole
.value
=MaValeur;

Controle
.maj
();

document
.all
.csscontrole
.style
.visibility
='hidden';

}

</script>

</head>

<script language ="JavaScript">

Controle
.calculer
();
</script>

width=
\"250\"
class=
\"table1\">

<form method=
\"POST\" name=
\"form1\" action=
\"/Asp/test/Test.asp\">

----
width=
"50%">Ouvir le contrôle
,

width=
"50%"
id=
tdcontrole>

, </form>

</html>
Messages postés
13
Date d'inscription
mercredi 21 janvier 2004
Statut
Membre
Dernière intervention
16 juin 2006

Salut Ghislain,
C'est exactement çà que je cherchais.
Je te remercie beaucoup
A+