Evenements (onChange) sur element DOM

xactise Messages postés 507 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 22 juin 2012 - 15 janv. 2010 à 15:15
xactise Messages postés 507 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 22 juin 2012 - 18 janv. 2010 à 11:14
Bonjour à tous,

je vous expose ma problématique

Je crée des element en DOM mais a certain de ces element j'aimerai leur attribuer des evenement (onclick, onload, onchange, etc..)

sauf que je ne sais pas comment m'y prendre.

J'ai éssayer :

selectt = document.createElement("select");
selectt.name = "f_raison_annulation[]";
selectt.id = "raison_annulation_"+type_formation+"_"+i;

selectt.onChange = "if(this.value=='Autre') document.getElementById('raison_annulation_autre_"+type_formation+"_"+i+"').style.display='block'; else document.getElementById('raison_annulation_autre_"+type_formation+"_"+i+"').style.display='none';";

selectt.onLoad = "if(this.value=='Autre') document.getElementById('raison_annulation_autre_"+type_formation+"_"+i+"').style.display='block'; else document.getElementById('raison_annulation_autre_"+type_formation+"_"+i+"').style.display='none';";

Sans succès, quelqu'un aurait une idée ?

D'avance merci
L0rD...

8 réponses

xactise Messages postés 507 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 22 juin 2012 2
15 janv. 2010 à 16:10
J'ai égallement essayer sa :

selectt = document.createElement("select");

selectt.name = "f_raison_annulation[]";
selectt.id = "raison_annulation_"+type_formation+"_"+i;
selectt.onchange = function() {
if(this.value=='Autre')
document.getElementById("raison_annulation_autre_"+type_formation+"_"+i).style.display='block';
else
document.getElementById("raison_annulation_autre_"+type_formation+"_"+i).style.display='none';
}
selectt.onload = function() {
if(this.value=='Autre')
document.getElementById("raison_annulation_autre_"+type_formation+"_"+i).style.display='block';
else
document.getElementById("raison_annulation_autre_"+type_formation+"_"+i).style.display='none';
}

sans success

L0rD...
0
@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
15 janv. 2010 à 17:39
bonjour

tu doit le faire par le biais d'une fonction

selectt.onChange = if(this.value=='Autre') function(){document.getElementById('raison_annulation_autre_"+type_formation+"_"+i+"').style.display='block';} else function(){document.getElementById('raison_annulation_autre_"+type_formation+"_"+i+"').style.display='none'};
0
xactise Messages postés 507 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 22 juin 2012 2
15 janv. 2010 à 17:52
Bonjour et merci pour votre réponse.

Cependant j'obtiens une erreur de syntax avec ceci

selectt.onChange = if(this.value=='Autre') function(){document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='block';} else function(){document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='none'};


L0rD...
0
@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
15 janv. 2010 à 21:22
cette syntaxe devrait etre bonne

if(this.value=='Autre'){
selectt.onChange=function()document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='block';} 
}
else
selectt.onChange=function()document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='none'};
0

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

Posez votre question
@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
15 janv. 2010 à 21:25
petit oubli

if(this.value=='Autre'){
selectt.onChange=function(){document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='block';} 
}
else
selectt.onChange=function(){document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='none'};
}
0
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
16 janv. 2010 à 06:54
Bonjour à tous,
il est a noter que le this.value changera en fonction de la sélection, donc il faut intégrer le test dans la fonction associée à l'événement onchange, ce qui donnerait
selectt.onChange = function(){
  if(this.value=='Autre')
    this.style.display='block';
  else
    this.style.display='none';
};

mais quel est l'intérêt de masquer un SELECT qui ne sera donc plus accessible...
Je n'ai peut être pas tout saisi...

;O)
0
xactise Messages postés 507 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 22 juin 2012 2
18 janv. 2010 à 09:18
Aucune de vos solutions ne fonctionne apparement même après y avoir retoucher un peu, vous avez peut-être pas saisie le contexte je vais ré-expliquer.

Je créer dynamiquement avec DOM des formulaire

dans ce formulaire il y a un select. qui correspond a une raison d'annulation "pré-définie" avec un choix Autres, si ce choix Autres apparait, alors un textarea apparait pour indiquer le complément. mais le tous dynamiquement avec DOM.

Voici mon dernier éssaie repris de PetoleTeam qui ne m'indique pas d'erreur mais qui ne fonctionne pas.

selectt.onChange = function(){
if(this.value=='Autre')
document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='block';
else
document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='none';
};

selectt.onLoad = function(){
if(this.value=='Autre')
document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='block';
else
document.getElementById('raison_annulation_autre_'+type_formation+'_'+i).style.display='none';
};





L0rD...
0
xactise Messages postés 507 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 22 juin 2012 2
18 janv. 2010 à 11:14
Non ben j'ai rien dit c'est bon sa ne marchais pas a cose de ma condition JS

Désolé merci beaucoup


L0rD...
0
Rejoignez-nous