Déclaration d'events à la volée et variables
Bonjour, mon titre n'est pas explicite je le conçois, mais je vais expliquer clairement mon problème.
Dans une fonction javascript, je crée des inputs, à la volée en fonction des paramètres donnés (objet).
Exemple :
Code:
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
| {fields:[
{
privateName:'projectPublicName',
publicName:'Nom du projet (public)',
type:'text',
onclick:function(event,inputs,checkspan){
console.log(event);
console.log(inputs);
console.log(checkspan);
var iCode = (event.keyCode ? event.keyCode : event.which);
if(iCode == 13){
submitCreateNewProject();
}
},
check:true
},
{
privateName:'projectPrivateName',
publicName:'Nom du projet (private)',
type:'text',
check:true,
onkeypress:function(event,inputs,checkspan){
console.log(event);
console.log(inputs);
console.log(checkspan);
var iCode = (event.keyCode ? event.keyCode : event.which);
if(iCode == 13){
submitCreateNewProject();
}
}
}
]} |
je crée des input de cette façon :
Code:
1 2 3 4 5 6 7 8 9 10 11
| for(var i=0;i<oParams.fields.length;i++){
var oTmpInput = oParams.fields[i];
if(undefined === typeof(oTmpInput.privateName) || undefined === typeof(oTmpInput.publicName) || undefined === typeof(oTmpInput.type))continue;
var eTmpInput = (oTmpInput.type !== 'textarea')?document.createElement('input'):document.createElement('textarea');
$(eTmpInput).attr({id:oTmpInput.privateName,name:oTmpInput.privateName,'iter':i});
if(oTmpInput.type !== 'textarea')$(eTmpInput).attr({type:oTmpInput.type});
aAllInputElements.push(eTmpInput);
aAllInputObjects.push(oTmpInput);
} |
Ensuite je stocke les input (éléments) et leur objets respectifs dans deux tableaux.
Jusqu'ici pas de problèmes.
Dans un deuxième temps je parcours mon tableau contenant les éléments input créés afin de leur attribuer des events (ceux définis dans l'objet).
Exemple :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13
| for(var i=0;i<aAllInputElements.length;i++){
var oInput = aAllInputObjects[i]; //objets définit en paramètres
var eTmpInput = aAllInputElements[i]; //input créés.
if('function' === typeof(oInput.onkeypress)){
$(e).keypress(
function(event){
console.log(oInput);
oInput.onkeypress(event,aAllInputElements);
}
);
}
} |
Et c'est ici que ça plante : le console.log affiche le dernier objet contenu dans aAllInputObjects, pour n'importe quel input
J'ai tenté de mettre un attribut "iter" contenant l'indice de l'objet sur l'input.
Et ensuite faire ceci :
Code:
1 2 3 4 5 6
| $(e).keypress(
function(event){
var oInput = aAllInputObjects[parseInt($(this).attr('iter'))];
oInput.onkeypress(event,aAllInputElements);
}
); |
La ça marche mais pas très propre je trouve.
Voilà pour l'explication de mon problème, donc si quelqu'un à une solution, je suis impatient de la voir !
Merci d'avance pour vos réponses.
Ps : la fonction entière pour ceux qui veulent plus de code http://dl.free.fr/t8GepPKcy