11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à la communauté,

Je suis débutant en javascript et je viens de réaliser un formulaire en html. J'ai réaliser un code permettant la vérification des champs de mon formulaire (tel que le nom, prénom et e-mail).

Cependant j'ai deux petits souci dont je n'arrive pas à résoudre seul.

Le premier c'est que j'ai au final un bouton qui doit permettre après vérifcation des champs rempli, engendrer l'impression du document (avec onclick), cependant je n'arrive pas à associer à la fois avec le onclick la verif des champs et l'impression par la suite! Est-il possible d'associer les deux? Si oui comment...

Le deuxième, il s'agit en fait de boutons radio, l'un est avec "checked" pour mettre que l'un des deux boutons soit coché mais je veux que lorsque l'internaute clique sur le deuxième bouton, il y est un message qui affiche une nota bene.

Je ne veux pas que la nota bene s'affiche avec la fonction "alert" qui ouvre une petite fenêtre de message d'alerte. Je veux que la nota bene s'affiche sous le choix des propositions.

Je vous laisse le code à la suite... Merci d'avance à la communauté css et js!

Voici le JS pour vérification des champs du formulaire :


<script language="javascript">
function verifChamps(){
	var error=0;
	if(form.nom.value==''){
		alert("Vous devez saisir un nom !");
		error++;
		exit;
	}
	if(form.prenom.value==''){
		alert("Vous devez saisir un prénom !");
		error++;
		exit;
	}
	if(form.adresse.value==''){
		alert('Vous devez saisir une adresse !');
		error++;
		exit;
	}
	if(form.email.value==''){
		alert('Vous devez saisir un e-mail !');
		error++;
		exit;
	}
	if(error==0){
		document.form.submit();
	}
}
</script>


Et voici le code html du formulaire :


<body>

<table align="center" bgcolor="#ffffff" width="943">
  <!--DWLayoutTable-->
  <!-- bannière -->
  <tr> 
    <td width="933" height="149" valign="top"><a href="index.html"><img src="img/logofiem.gif" width="490" height="147" border="0"></a> 
      <img src="img/logoenfants.jpg" width="415" height="106"> </td>
  </tr>
  <tr> 
    <td height="116" valign="top"> <p><span style="text-align:center; display:block" class="Style7">Bulletin 
        de Solidarit&eacute;</span></p>
      <p><span style="text-align:center; display:block" class="Style1">Imprimez 
        ce bulletin, apr&egrave;s l'avoir rempli &agrave; l'&eacute;cran et envoyez 
        le, avec votre don, &agrave; :</span></p>
      <p><span style="text-align:center; display:block" class="Style4">FIEM - 
        11 rue Jean-Charles AMAT - 1202 Gen&egrave;ve - Bo&icirc;te Postale 163 
        - CH-1211 Geneve 21 Suisse</span> </p>
      <p></p></td>
  </tr>
  <tr> 
    <td height="23" valign="top"><hr></td>
  </tr>
  <tr> 
    <td height="440" valign="top"><div align="left"> 
        <p></p>
        <form name="form" action="" method="post">
          <table width="95%" border="0" cellspacing="0">
            <!--DWLayoutTable-->
            <tr> 
              <td width="56" height="13"></td>
              <td width="9"></td>
              <td width="277"></td>
              <td width="19"></td>
              <td width="91"></td>
              <td width="46"></td>
              <td width="376"></td>
              <!--DWLayoutTable-->
            <tr>
              <td height="26"></td>
              <td></td>
              <td></td>
              <td colspan="3" valign="top"><span class="Style8">*</span> <span class="Style1">Champs 
                obligatoires</span></td>
              <td></td>
            <tr>
              <td height="14"></td>
              <td></td>
              <td></td>
              <td></td>
              <td></td>
              <td></td>
              <td></td>
            <tr> 
              <td height="24" colspan="2" valign="top"><span class="Style1"> Nom</span> 
                <span class="Style8">*</span></td>
              <td colspan="4" valign="top"> <input name="nom" type="text" size="30"> 
              </td>
              <td>&nbsp;</td>
            </tr>
            <tr> 
              <td height="24" colspan="2" valign="top"><span class="Style1"> Prénom</span> 
                <span class="Style8">*</span></td>
              <td colspan="4" valign="top"> <input name="prenom" type="text" size="30"> 
              </td>
              <td>&nbsp;</td>
            </tr>
            <tr> 
              <td height="104" colspan="2" valign="top"><span class="Style1"> 
                Adresse</span> <span class="Style8">*</span></td>
              <td colspan="4" valign="top"><textarea name="adresse" cols="40" rows="5">
			  </textarea> 
              </td>
              <td>&nbsp;</td>
            </tr>
            <tr> 
              <td height="24" colspan="2" valign="top"><span class="Style1"> E-mail</span> 
                <span class="Style8">*</span></td>
              <td colspan="4" valign="top"> <input name="email" type="text" size="30"> 
              </td>
              <td></td>
            </tr>
            <tr> 
              <td height="26" colspan="2" valign="top"><span class="Style1"> Pays</span> 
              </td>
              <td colspan="4" valign="top"> <select name="pays">
                  <option value="Suisse">Suisse</option>
                  <option value="France">France</option>
                  <option value="Autres">Autres</option>
                </select> &nbsp;&nbsp;Si autres, pr&eacute;cisez :&nbsp;&nbsp; 
                <input name="precision" type="text" size="15"> </td>
              <td></td>
            </tr>
            <tr> 
              <td height="78" colspan="2" valign="top"><span class="Style1"> Paiement</span> 
                <span class="Style8">*</span></td>
              <td colspan="4" valign="top"> <p>chèque 
                  <input type="radio" name="paiement" value="cheque" checked>
                  virement bancaire 
                  <input type="radio" name="paiement" value="virement bancaire">
                </p>
                <p><span class="Style1">nb : Veuillez fournir un RIB ou un RIP 
                  pour le virement bancaire.</span></p></td>
              <td></td>
            </tr>
            <tr> 
              <td height="37" colspan="6" valign="top"><span class="Style1">Signature 
                obligatoire :</span> </td>
              <td></td>
            </tr>
            <tr> 
              <td height="26" valign="top"> <input name="reset" type="reset" value="Effacer"></td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
              <td valign="top"> <input type="button" name="test" onClick="javascript:verifChamps()" value="Imprimer"></td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
          </table>
        </form>
        <p><span style="text-align:justify; display:block" class="Style1">Vous 
          recevrez ensuite un document servant comme preuve de paiement, &agrave; 
          fournir aux services fiscaux.</span></p>
        </div></td>
  </tr>
</table>

Modifié par djmatou (23 May 2006 - 10:27)