11550 sujets

JavaScript, DOM et API Web HTML5

RESOLU - Form name="formulaire1"

Bonjour,

J'ai un formulaire avec un name="formulaire1", ensuite je fais afficher mon résultat dans un popup en mettant ceci comme code.


window.opener.document.formulaire1.animal.value;


Je sais que le name n'est plus utilisé et j'aimerais adapter mon code en utilisant un ID sur mon formulaire. Mais qu'est-ce que je dois modifier pour faire afficher correctement mon résultat.

merci
Modifié par britanicus75 (30 Jan 2009 - 21:55)
document.formulaire.champ.value c'est l'ancienne syntaxe, elle ne devrait plus être utilisée.
Normalement, on doit utiliser document.forms['formulaire'].elements['champ'].value à la place. Ca vaut qu'on utilise name ou id.
J'ai essayé mais je suis pas sure si j'ai bien compris. J'ai changé le name="formulaire1" pour un id="formulaire1"

Voici mon ancien code :

window.opener.document.formulaire1.animal.value;


Est-ce que le nouveau code sera :

window.opener.document.forms['formulaire1'].elements['animal']


merci
Ton nouveau code fonctionnera si le form a toujours name="formulaire1" parce que 
window.opener.document.forms
accede aux formulaires par leur name, pas leur ID (qui est un identifiant unique à la page, pour tout type d'element).
Tu peux mettre un name et un id a ton formulaire, meme si differents.
Pour y acceder par l'id, tu peux faire comme ça :
window.opener.document.getElementById('id_du_formulaire1').animal.value;
J'ai bien changer mes infos mais l'affichage du résultat ne se fait pas correctement.

Je vous copie les deux pages de code source. J'ai fait le grand ménage dans le code juste pour garder que le formulaire.
Quelqu'un voit ou j'ai gaffé?

Page Formulaire.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>titre</title>


<script type="text/javascript">
function affichage() {
	window.open('resultat.html','NouvelleFenetre'+Math.floor(Math.random()*9999), 'toolbar=yes,status=no,scrollbars=1,width=800,height=700');
}
function checkCity(myobj){
	if(myobj*1 == 9)
		document.getElementById('animauxDiv').style.display = 'block';
	else
		document.getElementById('animauxDiv').style.display = 'none';
}
</script>
</head>
<body>

<form action="" method="post" enctype="text/plain" id="formulaire1">

<label>Animal :</label>
<select name="animal">
<option value="" selected="selected">Choisir</option>
<option value="chat">chat</option>
<option value="chien">chien</option>
</select>
<br />

<label>Sexe :</label>
<select name="sexe">
<option value="" selected="selected">Choisir</option>
<option value="mâle">mâle</option>
<option value="femelle">femelle</option>
</select>
<br />

<label>Sterile :</label>
<select name="ster">
<option value="" selected="selected">Choisir</option>
<option value="1">oui</option>
<option value="2">non</option>
</select>
<br />

<label>Prénom :</label>
<input name="prenom">
<br />
<label>Nom :</label>
<input name="nom">
<br />
<label>Adresse :</label>
<input name="adresse">
<br />
<label>Ville :</label>
<select name="ville" onchange="checkCity(this[this.selectedIndex].value);">
<option value="" selected="selected">Choisir</option>

<option value="1">Beloeil</option>
<option value="2">Brossard</option>
<option value="3">Carignan</option>
<option value="4">Chambly</option>
<option value="5">Greenfield Park</option>
<option value="6">Lemoyne</option>
<option value="7">Longueuil</option>
<option value="8">MarieVille</option>
<option value="9">McMasterville</option>
<option value="10">Otterburn Park</option>
<option value="12">Saint-Antoine-sur-le-Richelieu</option>
<option value="13">Ste-Julie</option>
<option value="14">St-Amable</option>
<option value="15">St-Lambert</option>
<option value="17">St-Blaise sur le Richelieu</option>
<option value="18">St-Bruno</option>
<option value="19">St-Hilaire</option>
<option value="20">St-Hubert</option>
<option value="21">St-Marc sur le Richelieu</option>
<option value="22">St-Mathias</option>
<option value="23">St-Mathieu de Beloeil</option>
<option value="24">St-Paul de l'Île au Noix </option>
<option value="25">Varennes</option>
</select>

<br />

<div id="animauxDiv" style="display: none;">
<label>Cette licence est pour votre 1<sup>er</sup> ou 2<sup>e</sup> animal :</label>
<select name="numanimaux">
<option value="" selected="selected">Choisir</option>
<option value="1">1er</option>
<option value="2">2e</option>
</select>
<br />
</div>

<label>Téléphone résidentiel :</label>
<input name="telephone">
<br />

<label>Téléphone cell :</label>
<input name="telephone2">
<br />

<label>Téléphone autre :</label>
<input name="telephone3">
<br />

<label>Nom de l'animal :</label>
<input name="nom_animal">
<br />
<label>Race :</label>
<input name="race">
<br />
<label>Couleur :</label>
<input name="couleur">

<div class="clear"></div>

<input value="Afficher" onclick="affichage();" class="bouton" type="button">
<input value="Effacer" class="bouton" type="reset">

</form>

</body>
</html>



Page popup du résultat:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>titre</title>

</head>

<body>

<input value="Imprimer cette page" onclick="window.print()" class="bouton" type="button">

<script type="text/javascript">


	var montantApayer = 0;
	var animale = window.opener.document.getElementById('formulaire1').animal.value;	
	var sterile = window.opener.document.getElementById('formulaire1').ster.value;
	var laville = window.opener.document.getElementById('formulaire1').ville.value;
		
	var nomville = '';
	var nombreAnimaux = '';


	switch(laville*1){
		case 1:
			nomville = 'Beloeil';
			montantApayer = 15;
		break;
		case 2:
			nomville = 'Brossard';
			// faut valider sterile
			if(sterile == ''){
				montantApayer = 'SVP choisir si votre animal est stérile';
			}
			if(sterile == 1){
				montantApayer = 20;
			}
			if(sterile == 2){
				montantApayer = 30;
			}
		break;
		case 3:
			nomville = 'Carignan';
			montantApayer = 15;
		break;
		case 4:
			nomville = 'Chambly';
			montantApayer = 20;
		break;
		case 5:
			nomville = 'Greenfield Park';
			montantApayer = 25;
		break;
		case 6:
			nomville = 'Lemoyne';
			montantApayer = 25;
		break;
		case 7:
			nomville = 'Longueuil';
			montantApayer = 25;
		break;
		case 8:
			nomville = 'MarieVille';
			montantApayer = 15;
		break;
		case 9:
			nomville = 'McMasterville';
			
			if(window.opener.document.getElementById('formulaire1').numanimaux.value*1 == 1){
				montantApayer = 10;
				nombreAnimaux = 'premier';
			}
			if(window.opener.document.getElementById('formulaire1').numanimaux.value*1 == 2){
				montantApayer = 20;
				nombreAnimaux = 'deuxieme';
			}
			
			if(window.opener.document.getElementById('formulaire1').numanimaux.value*1 == ''){
				montantApayer = 'Erreur';
				nombreAnimaux = 'Choisi le nombre d\'animaux';
			}
		break;
		case 10:
			nomville = 'Otterburn Park';
			montantApayer = 16;
		break;
		/*case 11:
			nomville = 'Richelieu';	
			montantApayer = 'Veuillez contacter votre ville';
		break;*/
		case 12:
			nomville = 'Saint-Antoine-sur-le-Richelieu';
			montantApayer = 15;
		break;
		case 13:
			nomville = 'Ste-Julie';
			montantApayer = 20;
		break;
		case 14:
			nomville = 'St-Amable';
			montantApayer = 25;
		break;
		case 15:
			nomville = 'St-Lambert';
			// faut valider chat/chien
			if(animale == ''){
				montantApayer = 'SVP choisir votre animale';
			}
			if(animale == 'chat'){
				montantApayer = 15;
			}
			if(animale == 'chien'){
				montantApayer = 25;
			}
		break;
		/*case 16:
			nomville = 'St-Basile Le Grand';	
			montantApayer = 15;
		break;*/
		case 17:
			nomville = 'St-Blaise sur le Richelieu';
			montantApayer = 15;
		break;
		case 18:
			nomville = 'St-Bruno';
			// faut valider sterelise
			if(sterile == ''){
				montantApayer = 'SVP choisir si votre animal est stérile';
			}
			if(sterile == 1){
				montantApayer = 15;
			}
			if(sterile == 2){
				montantApayer = 25;
			}
		break;
		case 19:
			nomville = 'St-Hilaire';
			// faut valider chat/chien
			if(animale == ''){
				montantApayer = 'SVP choisir votre animale';
			}
			if(animale == 'chat'){
				montantApayer = 5;
			}
			if(animale == 'chien'){
				montantApayer = 20;
			}
		break;
		case 20:
			nomville = 'St-Hubert';	
			montantApayer = 25;
		break;
		case 21:
			nomville = 'St-Marc sur le Richelieu';
			montantApayer = 15;
		break;
		case 22:
			nomville = 'St-Mathias';
			montantApayer = 15;
		break;
		case 23:
			nomville = 'St-Mathieu de Beloeil';
			montantApayer = 15;
		break;
		case 24:
			nomville = 'St-Paul de l\'Île au Noix ';
			montantApayer = 15;
		break;
		case 25:
			nomville = 'Varennes';
			montantApayer = 15;
		break;

	}
document.write("<p class='red'><strong>Montant à payer pour "+nomville+" : " + montantApayer + "$</strong></p>");
document.write("<p>Animal : <span>" + window.opener.document.getElementById('formulaire1').animal.value + "</span></p>");
document.write("<p>Sexe : <span>" + window.opener.document.getElementById('formulaire1').sexe.value + "</span></p>");
document.write("<p>Stérile : <span>");



if(window.opener.document.getElementById('formulaire1').ster.value*1 == 1){
	document.write("Oui");
}
if(window.opener.document.getElementById('formulaire1').ster.value*1 == 2){
	document.write("Non");
}

document.write("</span></p>");
document.write("<p>Prénom : <span>" + window.opener.document.getElementById('formulaire1').prenom.value + "</span></p>");
document.write("<p>Nom : <span>" + window.opener.document.getElementById('formulaire1').nom.value + "</span></p>");
document.write("<p>Adresse : <span>" + window.opener.document.getElementById('formulaire1').adresse.value + "</span></p>");   
document.write("<p>Téléphone résidentiel : <span>" + window.opener.document.getElementById('formulaire1').telephone.value + "</span></p>");
document.write("<p>Téléphone cell : <span>" + window.opener.document.getElementById('formulaire1').telephone2.value + "</span></p>");
document.write("<p>Téléphone autre : <span>" + window.opener.document.getElementById('formulaire1').telephone3.value + "</span></p>");
document.write("<p>Nom de l'animal : <span>" + window.opener.document.getElementById('formulaire1').nom_animal.value + "</span></p>");

if(nombreAnimaux != ''){
document.write("<p>Licence pour : <span> "+nombreAnimaux+" </span></p>");
}
document.write("<p>Race : <span>" + window.opener.document.getElementById('formulaire1').race.value + "</span></p>");
document.write("<p>Couleur : <span>" + window.opener.document.getElementById('formulaire1').couleur.value + "</span></p>");

  
</script><p class="red"><strong>Montant à payer pour  : 0$</strong></p><p>Animal : <span></span></p><p>Sexe : <span></span></p><p>Stérile : <span></span></p><p>Prénom : <span></span></p><p>Nom : <span></span></p><p>Adresse : <span></span></p><p>Téléphone résidentiel : <span></span></p><p>Téléphone cell : <span></span></p><p>Téléphone autre : <span></span></p><p>Nom de l'animal : <span></span></p><p>Race : <span></span></p><p>Couleur : <span></span></p>

</body>
</html>

Modifié par britanicus75 (30 Jan 2009 - 21:55)
Enlève opener...

window.document.getElementById('id formulaire')

//-----------------------------------------------------------------------------------------------------------//
// Fonction permettant de tester si un champ a été rempli (pour le tableau de connexion)                     //
//-----------------------------------------------------------------------------------------------------------//
function TestChampVideAccueil()
{
  with (window.document.getElementById('idformulaire'))
  {
    if (! Pseudonyme.value)
    {
      alert('Merci d\'indiquer votre pseudonyme');
      return false;
    }
    if (! Password1.value)
    {
      alert('Merci de mettre un mot de passe');
      return false;
    }
  }
}

Modifié par Bilgor Le Rouge (10 Feb 2009 - 09:13)
Sujet clos
Aller à