Discussion :

[dragonfly]

Bonjour à tous,

desolé si ce sujet a déja été traité dans le forum mais je ne l'ai pas trouvé.
Je voudrais savoir si il est impossible d'automatiser la récupération de données contenu dans un formulaire sans faire les input un par un.

Ex:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
Pour chaque elementDeFormulaire dans Formulaire
   variable nom=elementDeFormulaire.id
   variable valeur=elementDeFormulaire.valeur
fin pour

Si quelqu'un a un script je suis preneur, si ca marche aussi avec les boutons radio alors la

MICI

[E.Bzz]

Bonjour,
quelque cose comme

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
le_form = document.forms['name_du_form'];
for (i=0; i<le_form.length; i++)
alert(le_form.elements[i].name + ' = ' + le_form.elements[i].value);

Pas de raison que les radio passent à la trappe

EDIT : par contre, attention à ne pas mélanger ID et NAME (seul IE se laisse avoir)

A+

[dragonfly]

Merci pour le code, j'osai pas espérer aussi simple ^^.

Je l'essaye et je reviens donner mes impressions.

P.S : j'utilise toujours l'ID comme ca pas de probléme

[dragonfly]

Aprés vérification, mes impressions sont les suivantes.

Script trés court, efficace, agréable a utiliser , etc...

MAIS parce qu'il y'a un mais, concernant les boutons radios, il me les affiche tous alors que moi je ne veut que celui qui coché...
C'est pour ca je disais les boutons radios ...

[E.Bzz]

concernant les boutons radios, il me les affiche tous alors que moi je ne veut que celui qui coché...
C'est pour ca je disais les boutons radios ...

C'est pour ça que je disais de pas mélanger NAME et ID

En utilisant bien les name (logique de formulaire) tu n'aurais que la value de celui coché

A+

[dragonfly]

Je viens d'essayer et non, en mettant les names, j'ai la même chose.

Voici mon code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
	this.recupForm = function(id){
		le_form = document.forms[id];
		for (i=0; i<le_form.length; i++){
			this.ajoutOption(le_form.elements[i].name,le_form.elements[i].value);
		}	
		this.httpRequest();
	}
 
	this.ajoutOption = function(nomOpt,option){
		var caracMag="&";
		if(this.option==0){
			caracMag="?";
		}	
		this.option++;
		this.url=this.url+caracMag+nomOpt+"="+option;
	}

et voici mes boutons radio

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
 Foil
<input id="foil" type="radio" value="oui" name="foil"/>
Oui
<input id="foil" type="radio" value="non" name="foil"/>
Non

A moins que je ne me sois planté dans la conception de mes boutons radio

[E.Bzz]

A moins que je ne me sois planté dans la conception de mes boutons radio

Certains de tes id sont dupliqués (un id doit être unique) ...

A+

[dragonfly]

OK OK je viens de corriger

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
 Foil
<input id="yFoil" type="radio" value="oui" name="foil"/>
Oui
<input id="nFoil" type="radio" value="non" name="foil"/>
Non

Mais j'ai toujours le même probléme...

[E.Bzz]

Mais j'ai toujours le même probléme...

Faudrait voir le code HTML de ton formulaire, ainsi que l'appel des fonctions ...

Et puis je vois des id dans ton code JS, alors qu'il s'agissait d'une logique basée sur les name.

A+

[dragonfly]

Des id, ou ca ?

Voici le code entier de mon formulaire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
 
<form action="javascript:var ajaxe=new ajax("chgCara","ajoutCarte.php"); ajaxe.recupForm("formAjout");" method="post" name="formAjout" id="formAjout"> 
<select onchange="" name="type" id="type">
<option value="">-------</option><
option value="1">Créature</option>
<option value="2">Artefact</option>
<option value="3">Créature-artefact</option>
<option value="4">Rituel</option>
<option value="5">Ephémère</option>
<option value="6">Enchantement</option>
<option value="7">Terrain</option>
</select><br/> 
<br/>Rareté <input type="text" value="" name="rarete" id="rarete"/><br/> Illustrateur 
<input type="text" value="" name="illustrateur" id="illustrateur"/>
<br/> Foil <input type="radio" value="oui" name="foil" id="yFoil"/> 
Oui   <input type="radio" value="non" name="foil" id="nFoil"/> Non   
<input type="submit" value="Ajouter" name="subAjout" id="subAjout"/></form>

et le code javascript en entier

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
 
// Création de la classe
// Parametre(s):
// id => Id de la div concernée
// url => URL du fichier a injecter dans la div
function ajax(id,url){
	this.id=id;
	this.url=url;
	// Ce paramétres permet de savoir si une option a été ajouté ou non (pour savoir si faut mettre (? ou &)
	this.option=0;
 
	// Fonction permettant de balancer une HTTPrequest
	this.httpRequest = function(){
		alert(this.url);
		var texte= '';
		var id=this.id;
		if (document.getElementById){
			document.getElementById(id).innerHTML= 'Ca arrive...';
		}
		var xmlhttp=false;
		try{
			xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
		}catch(e){
			try{
				xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
			}catch(E){
				xmlhttp = false;
			}
		}
		if(!xmlhttp && typeof XMLHttpRequest!='undefined'){
			try{
				xmlhttp = new XMLHttpRequest();
			} catch (e){
				xmlhttp = false;
			}
		}
		if(!xmlhttp && window.createRequest){
			try{
				xmlhttp = window.createRequest();
			} catch(E){
				xmlhttp = false;
			}
		}
		xmlhttp.open('POST',this.url,true);
		xmlhttp.onreadystatechange=function() {
			if (xmlhttp.readyState==4) {
				if(document.getElementById){
					document.getElementById(id).innerHTML = xmlhttp.responseText;
				}
			}
		}
		xmlhttp.setRequestHeader('Content_type','application/x-www-form-urlencoded');
		var data = 'texte='+escape(texte);
		xmlhttp.send(data);
	}
 
 
	// fonction permettant de rajouter des options a la fin de l'URL
	// Paramétres
	// nomOpt => Nom de l'option a mettre dans l'URL
	// option => Valeur de cette option
	this.ajoutOption = function(nomOpt,option){
		var caracMag="&";
		if(this.option==0){
			caracMag="?";
		}	
		this.option++;
		this.url=this.url+caracMag+nomOpt+"="+option;
	}
 
 
	// Fonction permettant de facon automatique de récupérer les données d'un formulaire
	this.recupForm = function(id){
		le_form = document.forms[id];
		for (i=0; i<le_form.length; i++){
			this.ajoutOption(le_form.elements[i].name,le_form.elements[i].value);
		}	
		this.httpRequest();
	}	
}

Voila

[dragonfly]

Au final , je rajoute juste une condition dans la boucle for pour gérer les boutons radio et les checkbox.
Si quelqu'un est intéréssé, voici le code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
		le_form = document.forms[id];
		for (i=0; i<le_form.length; i++){
 
			if(  (le_form.elements[i].type!="radio" && le_form.elements[i].type!="checkbox") || (le_form.elements[i].checked!=false) ){
				this.ajoutOption(le_form.elements[i].id,le_form.elements[i].value);
			}
		}