validation formulaire contenant input g�n�r� par javascript

**CedLeDebutant** · 03/10/2007, 17h33

Bonjour � tous,

Je suis un nouvel inscrit et apr�s avoir parcourus ce forum en long, en large et en travers, j'ai trouv� que l'aide y �tait tr�s abondante et pourquoi pas s'investir (autant pour moi que pour les autres !!!!).
Aujourd'hui je viens vers vous car je n'ai pas trouv� de solutions � mon probl�me. Il se peut meme que je sois le seul � l'avoir

Ce probleme ne survient que sur Firefox.
J'ai un formulaire dans lequel un bouton appelle une fonction javascript qui elle permet d'ajouter autant d'inputs que necessaire � ce formulaire. Une fois ceux ci renseign�s, vous validez le formulaire et j'affiche la valeur de chaque input au d�but de ma page.
Le probleme c'est que sous Firefox seul l'input deja pr�sent dans la page me renvoie sa valeur alors que ceux g�n�r� par le javascript ne renvoie pas (ils n'existe meme pas pour firefox).
voici le code de la fonction en javascript:

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
function addNewCurse(){
	divListeCurse = document.getElementById("listeCurse");
 
	Div = document.createElement("div");
	newAttach = document.createElement("input");
	newAttach.setAttribute("name","newcours[]");
	newAttach.setAttribute("type","text");
	Div.appendChild(newAttach);
 
	remLink = document.createElement("a");
	remLink.appendChild(document.createTextNode("Delete"));
	remLink.setAttribute("href","javascript:void(0)");
	remLink.setAttribute("onclick","remAttachment()");
	remLink.setAttribute("class","lien");
	remLink.setAttribute("className","lien");
	//ci dessous on est OBLIGE de mettre la fonction comme ça pour
	// des raisons de compatibilité IE...
	remLink.onclick=function(e){
		e=e||window.event;
		//taget = Ff et srcElement = IE
		var theTarget = e.target || e.srcElement;
		child = theTarget.parentNode;
		divListeCurse = document.getElementById("listeCurse");
		divListeCurse.removeChild(child);
	};
	Div.appendChild(remLink);
	divListeCurse.appendChild(Div);
	//divListeCurse.insertBefore(Div,divListeCurse.childNodes[0]);
}

Voici une partie du code de la page contenant le 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
19
20
21
22
23
function cycleAdmin(){
 
$_SESSION['errorMessage']='';
 
if (isset($_POST['action'])){
	if (!isset($_POST['newcours']))
		$_SESSION['errorMessage'].='Veuillez renseigner au moins un nom de cours<br />';
	else{
		for($i=0; $i<count($_POST['newcours']);$i++)
			echo $_POST['newcours'][$i]." ";
}
$html="<table cellpadding=0 cellspacing=0 width=100%>
	<form action='' method='post'>
		<input type='hidden' name='part' value='cycle'>
		<input type='hidden' name='action' value='newcycle'>
		<tr>
			<td><div id='listeCurse'><input type='text' name='newcours[]' value=''><input type='button' onclick='addNewCurse();' value='Add an other curse'></div></td>
		</tr>
		<tr><td><input type='submit' value='OK'></td></tr>
	</form>
	</table>";
return $html;
}

Je vous remercie d'avance pour votre aide.

PS : Je voudrais quand meme signaler que ce code marche tres bien sous IE alors que la plupart du temps c'est l'inverse, non ???

**CedLeDebutant** · 03/10/2007, 20h39

En fait je peux vous r�duire le code pour que �a marche dans un seul meme fichier index.php.
Dont voici le 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
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
<?php
$html = '<html>
<head>
        <script type="text/javascript">
                function addNewCurse(){
                        divListeCurse = document.getElementById("listeCurse");
                        
                        Div = document.createElement("div");
                        newAttach = document.createElement("input");
                        newAttach.setAttribute("name","newcours[]");
                        newAttach.setAttribute("type","text");
                        Div.appendChild(newAttach);
                        
                        remLink = document.createElement("a");
                        remLink.appendChild(document.createTextNode("Delete"));
                        remLink.setAttribute("href","javascript:void(0)");
                        remLink.setAttribute("onclick","remAttachment()");
                        remLink.setAttribute("class","lien");
                        remLink.setAttribute("className","lien");
                        //ci dessous on est OBLIGE de mettre la fonction comme ça pour
                        // des raisons de compatibilité IE...
                        remLink.onclick=function(e){
                                e=e||window.event;
                                //taget = Ff et srcElement = IE
                                var theTarget = e.target || e.srcElement;
                                child = theTarget.parentNode;
                                divListeCurse = document.getElementById("listeCurse");
                                divListeCurse.removeChild(child);
                        };
                        Div.appendChild(remLink);
                        divListeCurse.appendChild(Div);
                        //divListeCurse.insertBefore(Div,divListeCurse.childNodes[0]);
                }
        </script>
</head>
<body>';
if (isset($_POST['action'])){
        if (!isset($_POST['newcours']))
                echo 'Veuillez renseigner au moins un nom de cours<br />';
        else{
                for($i=0; $i<count($_POST['newcours']);$i++)
                        echo $_POST['newcours'][$i]." ";
        }
}
$html .="<table cellpadding=0 cellspacing=0 width=100%>
        <form action='' method='post'>
                <input type='hidden' name='part' value='cycle'>
                <input type='hidden' name='action' value='newcycle'>
                <tr>
                        <td><div id='listeCurse'><input type='text' name='newcours[]' value=''><input type='button' onclick='addNewCurse();' value='Add an other curse'></div></td>
                </tr>
                <tr><td><input type='submit' value='OK'></td></tr>
        </form>
        </table>
</body>
</html>";
echo $html;
?>

Meme apres avoir �pur� le code de cette maniere je n'ai toujours pas plus d'une valeur d'affich�e dans le resultat.

Alors si vous avez ne serait ce qu'une id�e je suis preneur

merci d'avance.

**CedLeDebutant** · 04/10/2007, 12h40

C'est cool...pour la premiere fois que je pose un probleme, je suis le seul � en trouver une solution qui vous me direz n'en n'est pas vraiment une. La voici :
La seule facon pour moi de reccup�rer les valeurs de mon formulaire est de ne mettre que des input de meme "name" sinon �a ne passe pas

En clair j'ai du scinder en deux mon formulaire qui je vous l'accorde ne fait pas tres propre mais � l'avantage de fonctionn� !!!! c'est d�j� �a lol.

**SpaceFrog** · 04/10/2007, 13h04

en redefinissant dynamiquement le type submit du bouton submit du form apr�s ajout d'elements dynamique, les �l�ments ajout�s dynamiquements sont pris en compte pas php ..

**CedLeDebutant** · 04/10/2007, 13h31

Merci pour ton post SpaceFrog mais... que veux tu dire par redefinir dynamique ment le type submit de mon bouton form ???
ne serait ce pas cela :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

onclick='document.forms.nomduform.submit()'

si tu suggeres cela alors je me mets tout de suite au travail

car �a ferais plus propre quand meme !
merci d'avance.

**SpaceFrog** · 04/10/2007, 13h41

Non je dis juste

si par exemple tu as dasn ton form un bouton submit :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

<input id='monsubmit' type='submit' value='valider' />

apr�s avoir ajout� dynamiquement tes �l�ments

tu fais

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

document.forms['monform'].getElementById('monsubmit').type ='submit'

de plus �vite setattribute ...

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
newAttach = document.createElement("input");
newAttach.setAttribute("name","newcours[]");
newAttach.setAttribute("type","text");

pr�f�re lui la syntaxe:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
newAttach = document.createElement("input");
newAttach.name="newcours[]";
newAttach.type="text";

validation formulaire contenant input g�n�r� par javascript

JavaScript

Vue hybride

Discussions similaires

Partager

Partager