Unobstrusive JS avec select, option et event

Bonjour,

J'ai besoin d'un script qui affiche mes options dans mon select avec également une option vide et que lorsqu'on clique sur une option un evènement se produit et ça affiche la valeur correspondant du tableau.

Comment faire ?

Voici mon code actuel:

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
window.onload = formulaire;
function ajouteOption(){
	var o = document.createElement("option");
	o.type = "option";
}
function executeNote(event){
 
}
function formulaire(){
	//create a form
	var f = document.createElement("form");
	f.setAttribute('method',"post");
	f.setAttribute('action',this.addEventListener(onClick, executeNote, false));
	//create select element
	var s = document.createElement("select");
	s.type = "select";
	s.name = "notes_music";
	s.id = "notes_music";
	//create an array
	var notes = new Array();
	notes['noteDo'] = new Array('Do','C');
	notes['noteRe'] = new Array('Ré','D');
	notes['noteMi'] = new Array('Mi','E');
	notes['noteFa'] = new Array('Fa','F');
	notes['noteSol'] = new Array('Sol','G');
	notes['noteLa'] = new Array('La','A');
	notes['noteSi'] = new Array('Si','B');
	notes['noteDo'] = new Array('Do','C');
	//add option element to the select
	notes.forEach(function(ajouteOption){
		s.appendChild(o);
	});
	// add all elements to the form
	f.appendChild(s);
	s.add(o);
	// add the form inside the body
	document.getElementsByTagName('body')[0].appendChild(f);
}