Modification de l'événement onchange

Bonjour à tous,

j'explique mon problème.

Je possède un formulaire sur une de mes pages. Certaines des listes déroulantes ont un événement onchange attribué (notamment pour le chargement de liste en boucle).

Mais à la fin de la page je lance un fonction qui attribue une nouvelle valeur à la fonction onchange (c'est une fonction qui permet de vérifier que les champs obligatoires sont saisis). J'aimerais donc savoir comment modifier le onchange sans écraser ce qu'il contenait auparavant.

Voilà brievement mon code :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <html> <head> ... </head> <body> ... <form ...> ... <select name="TypeOrganisme" onchange="chargerListe('Organisme');" required="1"> <option value=""></option> ... </select> ... </form> <script type="text/javascript"> initFormValidation(document.form_creation); </script> </body> </html>
Et voilà ce que fait (entre autres) la fonction javascript :
Code:

1 2 3 4 5 6 7 8 9 10 function initFormValidation(formulaire){ var selects = document.getElementsByTagName('SELECT'); for(var no=0;no<selects.length;no++){ selects[no].onblur = validateInput; selects[no].onchange = validateInput; selects[no].onpaste = validateInput; selects[no].onkeyup = validateInput; } }
C'est donc dans cette fonction que je voudrais garder l'ancien onchange pour le mettre à jour et ne pas écrire par dessus.

Merci à vous, si j'ai pas été clair dite le moi. ^^

il faut attribue à une variable la fonction existante, puis attribuer une nouvelle fonction concaténant l'ancienne et la nouvelle, un exemple sera plsu parlant:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script type='text/javascript'>
function addOnchange(){
 
var oldfunction=document.getElementById('one').onchange;
document.getElementById('one').onchange=function(){oldfunction();alert('hello');}
}
 
 
</script>
</head>
 
<body>
<select id='one' onchange="alert('coucou')">
<option>xxxxxxx</option>
<option>xxxxxxx</option>
<option>xxxxxxx</option>
<option>xxxxxxx</option>
<option>xxxxxxx</option>
<option>xxxxxxx</option>
</select>
<input type='button' onclick='addOnchange()' value="modifier" />

Merci de ta réponse plus que rapide !

Apparament je suis pas doué parce que j'arrive pas à utiliser ce que tu m'a fourni pour mon cas. Je galère à cause de passage d'éléments du formulaire en paramètre de ces fonctions.

Je vais mettre mon code complet du coup :

formulaire :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<form name="form_creation" method="post" action="...">
	<select name="TypeOrganisme" onchange="ajax_chargerElement('chargerOrganismes', 'RefTypeOrganisme=' + this.value, 'loader_FournisseurExterne', this.form.RefOrganisme);" required="1">
		<option value=""></option>
		<option value="...">...</option>
	</select>
	<select name="RefOrganisme" required="1">
		<option value=""></option>
	</select>
	<input type="submit" name="ajout" value="Ajouter" />
</form>
 
<script type="text/javascript">
	initFormValidation(document.form_creation);
</script>

Et voilà le code javascript que j'ai essayé de modifié avec tes indications :

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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
function validateInput(e,inputObj){
	if(!inputObj)inputObj = this;		
	var inputValidates = true;
 
	if(formElementArray[inputObj.name]['required'] && inputObj.tagName=='INPUT' && inputObj.value.length==0)inputValidates = false;
	if(formElementArray[inputObj.name]['required'] && inputObj.tagName=='SELECT' && inputObj.selectedIndex==0){
		inputValidates = false;
	}
	if(formElementArray[inputObj.name]['mask'] && !inputObj.value.match(formValidationMasks[formElementArray[inputObj.name]['mask']]))inputValidates = false;
 
	if(formElementArray[inputObj.name]['freemask']){
		var tmpMask = formElementArray[inputObj.name]['freemask'];
		tmpMask = tmpMask.replace(/-/g,'\\-');
		tmpMask = tmpMask.replace(/S/g,'[A-Z]');
		tmpMask = tmpMask.replace(/N/g,'[0-9]');
		tmpMask = eval("/^" + tmpMask + "$/gi");
		if(!inputObj.value.match(tmpMask))inputValidates = false
	}	
 
	if(formElementArray[inputObj.name]['regexpPattern']){
		var tmpMask = eval(formElementArray[inputObj.name]['regexpPattern']);
		if(!inputObj.value.match(tmpMask))inputValidates = false
	}
	if(!formElementArray[inputObj.name]['required'] && inputObj.value.length==0 && inputObj.tagName=='INPUT')inputValidates = true;
 
	if(inputValidates){
		if(inputObj.type == "select-one") inputObj.className='validSelect';
		else inputObj.className='validInput';
	}else{
		if(inputObj.type == "select-one") inputObj.className='invalidSelect';
		else inputObj.className='invalidInput';
	}
 
	if(isFormValid(inputObj.form)) disableForm(false, inputObj.form);
	else disableForm(true, inputObj.form);
}
 
function initFormValidation(formulaire){
	var inputFields = document.getElementsByTagName('INPUT');
	var selectBoxes = document.getElementsByTagName('SELECT');
	var textareas = document.getElementsByTagName('TEXTAREA');
 
	var inputs = new Array();
 
 
	for(var no=0;no<inputFields.length;no++){
		if(inputFields[no].form == formulaire && inputFields[no].type != "submit" && inputFields[no].type != "button" && inputFields[no].type != "hidden")
			inputs[inputs.length] = inputFields[no];
 
	}	
	for(var no=0;no<selectBoxes.length;no++){
		if(selectBoxes[no].form == formulaire)
			inputs[inputs.length] = selectBoxes[no];
	}
	for(var no=0;no<textareas.length;no++){
		if(textareas[no].form == formulaire)
			inputs[inputs.length] = textareas[no];
	}
 
	for(var no=0;no<inputs.length;no++){
		var className = inputs[no].className;
		if(className && className.indexOf('validInput')>=0)continue;		
 
		var required = inputs[no].getAttribute('required');
		if(!required)required = inputs[no].required;
 
		var oldonchange = inputs[no].onchange;
		if(oldonchange != undefined) inputs[no].onchange = function(){ validateInput(false); oldonchange(); }
		else inputs[no].onchange = validateInput;
		inputs[no].onblur = validateInput;
		inputs[no].onpaste = validateInput;
		inputs[no].onkeyup = validateInput;
 
		formElementArray[inputs[no].name] = new Array();
		formElementArray[inputs[no].name]['mask'] = mask;
		formElementArray[inputs[no].name]['freemask'] = freemask;
		formElementArray[inputs[no].name]['required'] = required;
		formElementArray[inputs[no].name]['regexpPattern'] = regexpPattern;
 
		validateInput(false,inputs[no]);
	}
}

N'ayant pas été capable de faire marcher ça j'en suis donc revenu à laisser comme auparavant ces lignes :

Code:

1
2
3
4
inputs[no].onchange = validateInput;
inputs[no].onblur = validateInput;
inputs[no].onpaste = validateInput;
inputs[no].onkeyup = validateInput;

et à prendre le problème par l'autre bout en mettant :

Code:

1
2
3
4
5
6
7
8
<script type="text/javascript">
	initFormValidation(document.form_creation);
 
	document.form_creation.TypeOrganisme.onchange = function(){
		validateInput(false, document.form_creation.TypeOrganisme);
		ajax_chargerElement('chargerOrganismes', 'RefTypeOrganisme=' + document.form_creation.TypeOrganisme.value, 'loader_FournisseurExterne', document.form_creation.RefOrganisme);
	}
</script>

Et là tout marche sur firefox mais pas sur IE6 qui à l'air de ne pas aimer mon changement de onchange en dehors de la balise select. :cry: