Formulaire html+javascript
Fermé
crator
-
18 juin 2012 à 08:58
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 - 19 juin 2012 à 13:15
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 - 19 juin 2012 à 13:15
A voir également:
- Formulaire html+javascript
- Formulaire de réclamation facebook - Guide
- Telecharger javascript - Télécharger - Langages
- Editeur html - Télécharger - HTML
- Br html ✓ - Forum Webmastering
- Formulaire de reclamation instagram - Guide
7 réponses
Alain_42
Messages postés
5361
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
894
18 juin 2012 à 13:40
18 juin 2012 à 13:40
inspires toi de ces deux pages pour passer des valeurs entre page appelante A et popup page B
<html> <!-- Page A.html --> <head> <script type="text/javascript"> //ce javascript doit être dans le head de la page A function ouvrir_fenetre(url){ window.open(url,"page_B.html","menubar=yes, status=yes, scrollbars=yes, menubar=yes, width=500, height=500"); } </script> </head> <form name="form1" method="post" action=""> Nom: <input type="text" name="nom" id="nom" value="" /><br /><br /> Prenom: <input type="text" name="prenom" id="prenom" value="" /><br /><br /> <input type="button" name="envoyer" id="envoyer" value="Envoyer" onclick="ouvrir_fenetre('B.html');"/> </form> </html>
<html> <!-- Page B.html --> <head> <script type="text/javascript"> //ce javascript doit être dans le head de la page B //fonction lecture page A et ecriture page B function lit_ecrit(){ //1 ier champ var champ_A1=readValueFromParent('nom'); //lecture dans la page appelante A document.getElementById('nom_recu').value=champ_A1; //2 ième champ var champ_A2=readValueFromParent('prenom'); //lecture dans la page appelante A document.getElementById('prenom_recu').value=champ_A2; } //fonction recup valeurs depuis fenêtre apelante function readValueFromParent(id1){ var valeur=window.opener.document.getElementById(id1).value; return valeur; } </script> </head> Valeurs reçues du formulaire page A:<br /><br /> <form name="form1" method="post" action="B.html"> Nom: <input type="text" name="nom_recu" id="nom_recu" value="" /><br /><br /> Prenom: <input type="text" name="prenom_recu" id="prenom_recu" value="" /> </form> <script type="text/javascript"> // cette partie de javascript doit être après le formulaire ! lit_ecrit(); //on lance la fonction </script> </html>
Alain_42
Messages postés
5361
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
894
18 juin 2012 à 14:23
18 juin 2012 à 14:23
la fonction readValueFromParent(id1) est appelée plusieurs fois dans la fonction lit_ecrit() qui lui passe en argument 'nom' ou 'prenom' etc...
et la page B.html est en fait le popup
et la page B.html est en fait le popup
<head> <script type="text/javascript"> //ce javascript doit être dans le head de la page A function ouvrir_fenetre(url){ var win=window.open(site,"pop","width=400,height=900, directories: no,menubar: no,status: no, location: no,scrollbars:auto,resizable: yes"); win.focus(); } </script> </head> <form action="javascript:popup(page.html)"> <br> <table name="identification" border=0> <tr><td>Utilisateur:</td> <td><input type=text name=login ></td></tr> <tr><td>Mot de passe:</td> <td><input type=password name=password ></td> </table> <fieldset> <input type=radio name=space value="x"> x <input type=radio name=space value="y"> y <input type=radio name=space value="z"> z </fieldset> Version: <select name="choix"> <option value='1'>choix 1</option> <option value='2'>choix 2</option> </select> <input type=submit value="Valider"> </form>
<html> <!-- Page B.html (le popup )--> <head> <script type="text/javascript"> //ce javascript doit être dans le head de la page B //fonction lecture page A et ecriture page B function lit_ecrit(){ //1 ier champ login var champ_A1=readValueFromParent('login'); //lecture dans la page appelante A document.getElementById('login_recu').value=champ_A1; //2 ième champ bouton radio var champ_A2=readValueFromParent('radio'); //lecture dans la page appelante A //check et disabled du bt radio correspondant switch (champ_A2){ case 'x': document.getElementById('space_x').checked=true; document.getElementById('space_x').disabled=true; break; case 'y': document.getElementById('space_y').checked=true; document.getElementById('space_y').disabled=true; break; case 'z': document.getElementById('space_z').checked=true; document.getElementById('space_z').disabled=true; break; } } //fonction recup valeurs depuis fenêtre apelante function readValueFromParent(id1){ var valeur=window.opener.document.getElementById(id1).value; return valeur; } </script> </head> Valeurs reçues du formulaire page A:<br /><br /> <form name="form1" method="post" action="B.html"> Login: <input type="text" name="login_recu" id="login_recu" value="" /><br /><br /> <fieldset> <input type="radio" name="space" id="space_x" value="x"> x <input type="radio" name="space" id="space_x" value="y"> y <input type="radio" name="space" id="space_x" value="z"> z </fieldset> Version: <select name="choix"> <option value='1'>choix 1</option> <option value='2'>choix 2</option> </select> </form> <script type="text/javascript"> // cette partie de javascript doit être après le formulaire ! lit_ecrit(); //on lance la fonction </script> </html>
Alain_42
Messages postés
5361
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
894
18 juin 2012 à 15:34
18 juin 2012 à 15:34
e fait de disable le Select devrait se faire en live, es-ce possible avec un onchange
c'est à dire si on bouton radio coché on disabled le select "choix" du dessous ?
c'est à dire si on bouton radio coché on disabled le select "choix" du dessous ?
Alain_42
Messages postés
5361
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
894
18 juin 2012 à 16:07
18 juin 2012 à 16:07
après si tu connais un moyen d'ouvrir la fenêtre avec mes options sans que ce soit dans un pop-up ça m'arrangerais =)
Permalink (#3)
oui
1- soit en appelant une page php
2- soit avec avec window.location.href
tjs mes deux pages exemple pour la solution 2
Permalink (#3)
oui
1- soit en appelant une page php
2- soit avec avec window.location.href
tjs mes deux pages exemple pour la solution 2
<html> <!-- page1.html --> <head> <script type="text/javascript"> //ce javascript doit être dans le head de la page A function ouvrir_fenetre(url){ //on lit les valeurs pour les envoyer via l'URL var nom=document.getElementById('nom').value; var prenom=document.getElementById('prenom').value; var requete="var1='"+nom+"';var2='"+prenom+"';"; //on url-encode cette chaine requete=escape(requete); window.location.href = url+"?"+requete; } </script> </head> <form name="form1" method="post" action=""> Nom: <input type="text" name="nom" id="nom" value="" /><br /><br /> Prenom: <input type="text" name="prenom" id="prenom" value="" /><br /><br /> <input type="button" name="envoyer" id="envoyer" value="Envoyer" onclick="ouvrir_fenetre('page2.html');"/> </form> </html>
<html> <!-- page2.html --> <head> </head> Valeurs reçues du formulaire page A:<br /><br /> <form name="form1" method="post" action="B.html"> Nom: <input type="text" name="nom_recu" id="nom_recu" value="" /><br /><br /> Prenom: <input type="text" name="prenom_recu" id="prenom_recu" value="" /> </form> <script type="text/javascript"> // /// ce javascript doit être après le formulaire !!!!!! var var1=""; var2=""; var requete = window.location.search ; if (requete) { requete=requete.substring(1) ; //on « url-décode » cette chaine : requete = unescape(requete) ; //et enfin, puisqu'on a pris soin de générer du javascript, on l'exécute : eval(requete); } document.getElementById('nom_recu').value=var1; document.getElementById('prenom_recu').value=var2; </script> </html>
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Alain_42
Messages postés
5361
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
894
18 juin 2012 à 16:41
18 juin 2012 à 16:41
le ratio "x" étant sélectionné le select doit rester bloqué sur "choix 1", mais pour les autre ratio "y" et "z", l'utilisateur doit avoir le choix
<head> <script type="text/javascript"> //ce javascript doit être dans le head de la page A function ouvrir_fenetre(url){ //on lit les valeurs pour les envoyer via l'URL var login=document.getElementById('login').value; var liste_radio = document.forms["form1"].elements['space']; var valeur_radio; for (var i = 0; i < liste_radio.length; i++) { if (liste_radio[i].checked) { valeur_radio=liste_radio[i].value; } } var choix=document.getElementById('choix').value; var requete="var1='"+nom+"';var2='"+choix+"';"; //on url-encode cette chaine requete=escape(requete); window.location.href = url+"?"+requete; } function modif_select(){ //fonction appelée qq soit le bouron radio cliqué var liste_radio = document.forms["form1"].elements['space']; var valeur_radio; for (var i = 0; i < liste_radio.length; i++) { if (liste_radio[i].checked) { valeur_radio=liste_radio[i].value; } } if(valeur_radio =="x"){//si egal à x var liste_select=document.getElementById('choix').options; for(j=0;j<liste_select.length;j++){ if(j==0){ liste_select[j].selected=true; }else{ liste_select[j].disabled=true; } } }else{ //si un autre bouton radio (chagement de choix aprsèavoir initialemnt choisi x var liste_select=document.getElementById('choix').options; for(j=0;j<liste_select.length;j++){ liste_select[j].disabled=false; } } } </script> </head> <!-- ATTENTIION tu dois mettre les valeurs des argument des balises HTML entre " "--> <form method="post" name="form1" action=""> <table name="identification" border="0"> <tr> <td>Utilisateur:</td> <td><input type="text" name="login" id="login" value="" /></td> </tr> <tr> <td>Mot de passe:</td> <td><input type="password" name="password" id="password" value="" /> </td> </tr> </table> <fieldset> <input type="radio" name="space" id="space_1" value="x" onclick="modif_select();" /> x <input type="radio" name="space" id="space_2" value="y" onclick="modif_select();" /> y <input type="radio" name="space" id="space_3" value="z" onclick="modif_select();" /> z </fieldset> Version: <select name="choix" id="choix" > <option value="1">choix 1</option> <option value="2">choix 2</option> </select> <input type="button" name="envoyer" id="envoyer" value="Envoyer" onclick="ouvrir_fenetre('page2.html');"/> </form>
Alain_42
Messages postés
5361
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
894
19 juin 2012 à 09:18
19 juin 2012 à 09:18
soit plus precis, qu'est qui ne "tourne pas" car chez moi sur Firefox ça fonctionne
attention il faut que dans ta balise <form tu ait name=""form1"
avec firefox dans outils/developpeur Web tu as la console d'erreurs très pratique pour debugger du JS
attention il faut que dans ta balise <form tu ait name=""form1"
avec firefox dans outils/developpeur Web tu as la console d'erreurs très pratique pour debugger du JS
Alain_42
Messages postés
5361
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
894
19 juin 2012 à 13:15
19 juin 2012 à 13:15
mets qqs alert:
if (valeur_radio =="x"){ var liste_select=document.getElementById('choix').options; alert("Nombre d'option dans select: "+liste_select.length); for(j=0; j<liste_select.length ; j++){ if(j==0){ liste_select[j].selected=true; }else{ liste_select[j].disabled=true; } }
18 juin 2012 à 14:03
je ne comprend pas bien pourquoi tu refait un formulaire avec comme action d'aller sur B.html
et juste pour savoir : tu appel la fonction lit_ecrit() mais tu doit faire référence à readValueFromParent(idl), et à quoi va correspondre idl ?
18 juin 2012 à 14:04