Contrôle de formulaire avant envoi

Fermé
mepsy - 12 août 2010 à 12:42
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 - 15 août 2010 à 18:07
Bonjour,
j'espère que vous allez bien, ben voilà, j'ai un formulaire de vote en ligne à mettre en place. je souhaite procéder à un contrôle sur les champs ainsi que sur les cases à cocher mais je bute sur deux problèmes:

1) je souhaite que le votant coche 2 cases (ni plus ni moins) sur une zone de 5 cases:
illustration: j'ai créé un formulaire

zone asie : choix1 choix2 choix3 choix4 choix5 ici il doit cocher deux choix
zone europe : choix1 choix2 choix3 choix4 choix5 ici il doit cocher un choix
zone amerique : choix1 choix2 choix3 choix4 choix5 ici il doit cocher deux choix

et je dois recevoir le tout par email (là y a pas de problème). j'ai pu faire quelque chose (si avec firefox ça l'air de marcher même si là où le votant doit cocher deux cases s'il en coche une ça valide quand même) mais avec internet explorer mes contrôles ne sont pas pris en compte.

quelqu'un peut-il m'aider?


8 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
12 août 2010 à 14:20
il me semble avoir déjà vu ta question il y a qq temps?

donnes nous le code de ton formulaire

je suppose que tu veux faire une verif en javascript qui interdirait l'envoi du formulaire si le nombre de case n'est pas conforme
0
oui, c'est exactement ce que je veux faire. je veux vérifier que les champs sont bien remplis et que les cases à cocher le sont aussi. comme je le disais tantôt, il y a des choix ou le votant doit obligatoirement cocher deux cases, pas plus ni moins. merci de m'aider,j'insère le code à la suite :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans nom</title>
<script language="javascript">

// Formatage d'un champs mail(interdiction de quel que caractair)
function valid_mail(evt) {
var keyCode = evt.which ? evt.which : evt.keyCode;
var interdit = 'àâäãçéèêëìîïòôöõùûüñ &*?!:;,\t#~"^¨%$£?²¤§%*()[]{}<>|\\/'\'';
if (interdit.indexOf(String.fromCharCode(keyCode)) >= 0) {
return false;
}
}

function checkSelect(elmId){

maxOptionsSelect = 9;
form = document.all("form1");
inputs = form.getElementsByTagName("input");
count = 0;
for(i=0 ; i<inputs.length ; i++){
if(inputs[i].type=="checkbox" && inputs[i].checked==true){
count++;
}
}

if(count < maxOptionsSelect){
document.all(elmId).checked=false;

alert("Vous avez sauté une clé au moins une clé de répartition, nous vous prions de vérifier la ou lesquelles. Votre vote doit correspondre à " + maxOptionsSelect + " options");

return false;
}

}


function verif() //écriture de la fonction

{ var bool=true;

//var f1='document.form1';
var str = document.form1.email.value;

var regexp = new RegExp("^[a-zA-Z0-9_\\-\\.]{3,}@[a-zA-Z0-9\\-_]{2,}\\.[a-zA-Z]{2,4}$", "g");

if(bool){//debut

//Control de validité du Nom et du prenom.
if (document.form1.prenom.value==""){//debut

alert("Votre prénom doit nous etre fourni!");
document.form1.prenom.focus();
bool=false;
}//fin

//Control de validité du Nom et du prenom.
if (document.form1.nom.value==""){//debut

alert("Votre nom doit nous etre fourni!");
document.form1.nom.focus();
bool=false;
}//fin

//Control de validité du mail.
if(!regexp.test(str) || str=="") {//debut
alert("L'adresse e-mail n'est pas valide ! "+document.form1.email.value);
document.form1.email.focus();
bool=false;
}//fin


}//fin

//On active le bouton submit du formulaire.
if(bool==true){document.form1.submit();}


} // -->

<!--
function compteur_coches(obj) {
max = 2;
min = 1;

box1 = obj.form.case1.checked;
box2 = obj.form.case2.checked;
box3 = obj.form.case3.checked;
box4 = obj.form.case4.checked;
box5 = obj.form.case5.checked;

box6 = obj.form.case6.checked;
box7 = obj.form.case7.checked;
box8 = obj.form.case8.checked;
box9 = obj.form.case9.checked;
box10 = obj.form.case10.checked;

box11 = obj.form.case11.checked;
box12 = obj.form.case12.checked;
box13 = obj.form.case13.checked;
box14 = obj.form.case14.checked;
box15 = obj.form.case15.checked;

box16 = obj.form.case16.checked;
box17 = obj.form.case17.checked;
box18 = obj.form.case18.checked;
box19 = obj.form.case19.checked;
box20 = obj.form.case20.checked;

box21 = obj.form.case21.checked;
box22 = obj.form.case22.checked;
box23 = obj.form.case23.checked;
box24 = obj.form.case24.checked;
box25 = obj.form.case25.checked;

box26 = obj.form.case26.checked;
box27 = obj.form.case27.checked;
box28 = obj.form.case28.checked;
box29 = obj.form.case29.checked;
box30 = obj.form.case30.checked;

nombre = (box1 ? 1 : 0) + (box2 ? 1 : 0) + (box3 ? 1 : 0) + (box4 ? 1 : 0) + (box5 ? 1 : 0);
nombrea = (box6 ? 1 : 0) + (box7 ? 1 : 0) + (box8 ? 1 : 0) + (box9 ? 1 : 0) + (box10 ? 1 : 0);
nombreb = (box11 ? 1 : 0) + (box12 ? 1 : 0) + (box13 ? 1 : 0) + (box14 ? 1 : 0) + (box15 ? 1 : 0);
nombrec = (box16 ? 1 : 0) + (box17 ? 1 : 0) + (box18 ? 1 : 0) + (box19 ? 1 : 0) + (box20 ? 1 : 0);
nombred = (box21 ? 1 : 0) + (box22 ? 1 : 0) + (box23 ? 1 : 0) + (box24 ? 1 : 0) + (box25 ? 1 : 0);
nombree = (box26 ? 1 : 0) + (box27 ? 1 : 0) + (box28 ? 1 : 0) + (box29 ? 1 : 0) + (box30 ? 1 : 0);

if (nombre > max) {
alert("Vous ne pouvez pas cocher plus de " + max + " cases !");
obj.checked = false;
}
if (nombrea > max) {
alert("Vous ne pouvez pas cocher plus de " + max + " cases !");
obj.checked = false;
}
if (nombreb > min) {
alert("Vous ne pouvez pas cocher plus de " + min + " case !");
obj.checked = false;
}
if (nombrec > min) {
alert("Vous ne pouvez pas cocher plus de " + min + " case !");
obj.checked = false;
}
if (nombred > max) {
alert("Vous ne pouvez pas cocher plus de " + max + " cases !");
obj.checked = false;
}
if (nombree > min) {
alert("Vous ne pouvez pas cocher plus de " + min + " case !");
obj.checked = false;
}
}
// -->
</script>

<style type="text/css">
<!--
/*//////////////////////\\\\\\\\\\\\\\\\\\\\\
CSStyled by
copytop, Aout 2010
\\\\\\\\\\\\\\\\\\\\\\\\////////////////////*/

/* Layout globals */

body {
margin: 2em 0 0 0;
padding: 0;
text-align: center;
font: 0.75em/1.2em Verdana, Arial, Helvetica, sans-serif;
color: #666;
}
body * {
margin: 0;
padding: 0;
}
#full {
position: relative;
width: 75%;
margin: 0 auto;
text-align: left;
}

#middle {
width : 50%;
margin : auto;
}

/* formz */

fieldset {
margin-bottom: 1em;
border: 0;
width: auto;
margin: 0.5em;
background-color:#97AF12
}
fieldset p {
padding: 0 0 0.75em 0.5em !important;
padding: 0 0 0.35em 0.5em;
clear: both;

}
legend {
margin: 0 0 0.5em 0;
padding: 0.3em;
font: bold 0.9em Verdana, Arial, Helvetica, sans-serif;
color: #CCFFFF;
background-color:#97AF12 !important;
background-color: none;
}
label.text {
display: block;
float: left;
width: 40%;
text-align: right; /* n'hésitez pas pas à aligner à gauche, c'est pas mal aussi */
margin: 0 1em 0 0;
padding: 0.1em;
border-bottom: 1px solid #ABBF3B;
}
.radioCheck {
margin: 0 1em 0 0.25em;
}
input.text,
textarea {
width: 40%;
background-color: #CCFFFF;
border: 0;
margin-right: 0.25em;

}
.envoy {
margin: 1em 0;
text-align: center;
}
.envoy label {
border: 0;
}
hr {
visibility: hidden;
clear: both;
}
span.note {
font-size: 0.75em;
}
span.warning {
font-weight: bold;
font-size: 1.3em;
color: #fff;
}
-->
</style>

</head>

<body>
<div id="full">
<form enctype="multipart/form-data" id="form1" name="form1" method="post" form action="formulaire.php">
<p>
<fieldset id="Systeme de vote en ligne">
<legend>Vote en ligne</legend>
<hr />
</p>
</fieldset>
<fieldset id="coordonnee">
<legend>Coordonnées</legend>

<p>
<label class="text" for="prenom">Prenom</label>
<input class="text" id="prenom" name="prenom" type="text" /><span class="warning">*</span>
</p>
<p>
<label class="text" for="nom">Nom</label><input class="text" id="nom" name="nom" type="text" /><span class="warning">*</span>
</p>
<p>
<label class="text" for="email">Email</label><input class="text" id="email" name="email" type="text" /><span class="warning">*</span>
</p>

<hr />
</fieldset>
<fieldset id="connaitre">
<legend>Renouvellement du bureau de l'AG: vote par zone.</legend>
<p> </p>
<div id="middle"><form>
<p>
<input type="checkbox" name="case1" onClick="compteur_coches(this)" value="1">candidat1
<input type="checkbox" name="case2" onClick="compteur_coches(this)" value="2">candidat2
<input type="checkbox" name="case3" onClick="compteur_coches(this)" value="3">candidat3
<input type="checkbox" name="case4" onClick="compteur_coches(this)" value="4">candidat4
<input type="checkbox" name="case5" onClick="compteur_coches(this)" value="5">candidat5<br>
</p>

<p>
</form>
<input type="checkbox" name="case6" onClick="compteur_coches(this)" value="6">candidat1
<input type="checkbox" name="case7" onClick="compteur_coches(this)" value="7">candidat2
<input type="checkbox" name="case8" onClick="compteur_coches(this)" value="8">candidat3
<input type="checkbox" name="case9" onClick="compteur_coches(this)" value="9">candidat4
<input type="checkbox" name="case10" onClick="compteur_coches(this)" value="10">candidat5<br>
</p>

</form>

<p>
</form>
<input type="checkbox" name="case11" onClick="compteur_coches(this)" value="11">candidat1
<input type="checkbox" name="case12" onClick="compteur_coches(this)" value="12">candidat2
<input type="checkbox" name="case13" onClick="compteur_coches(this)" value="13">candidat3
<input type="checkbox" name="case14" onClick="compteur_coches(this)" value="14">candidat4
<input type="checkbox" name="case15" onClick="compteur_coches(this)" value="15">candidat5<br>
</p>

</form>

<p>
</form>
<input type="checkbox" name="case16" onClick="compteur_coches(this)" value="16">candidat1
<input type="checkbox" name="case17" onClick="compteur_coches(this)" value="17">candidat2
<input type="checkbox" name="case18" onClick="compteur_coches(this)" value="18">candidat3
<input type="checkbox" name="case19" onClick="compteur_coches(this)" value="19">candidat4
<input type="checkbox" name="case20" onClick="compteur_coches(this)" value="20">candidat5<br>
</p>

</form>
<p>
</form>
<input type="checkbox" name="case21" onClick="compteur_coches(this)" value="21">candidat1
<input type="checkbox" name="case22" onClick="compteur_coches(this)" value="22">candidat2
<input type="checkbox" name="case23" onClick="compteur_coches(this)" value="23">candidat3
<input type="checkbox" name="case24" onClick="compteur_coches(this)" value="24">candidat4
<input type="checkbox" name="case25" onClick="compteur_coches(this)" value="25">candidat5<br>
</p>

</form>
<p>
</form>
<input type="checkbox" name="case26" onClick="compteur_coches(this)" value="26">candidat1
<input type="checkbox" name="case27" onClick="compteur_coches(this)" value="27">candidat2
<input type="checkbox" name="case28" onClick="compteur_coches(this)" value="28">candidat3
<input type="checkbox" name="case29" onClick="compteur_coches(this)" value="29">candidat4
<input type="checkbox" name="case30" onClick="compteur_coches(this)" value="30">candidat5<br>
</p>

</form>
</div>
<hr />


<p align="center" class="envoy">
<input type="button" name="button" id="button" onclick="verif();" value="Envoyer" />
<input type="reset" name="Submit" value="Reinitialiser" />
</p>
</form>
<p> </p>

</body>
</html>
0
ben, voici une autre version du formulaire sans les contrôles déjà, je souhaite avoir les contrôle et récupérer tous les champs qui sont saisis. c'est le même principe, et d'ailleurs que ce dernier est mieux explicite par rapport à l'autre. là où il y a deux clés de répartition aucun autre moyen ne doit être accepté si ce n'est 2 cases cochés. là où il y en a un seul: une seule case doit être cochée. aucune zone ne doit avoir 0 coché ou plus de 2 ou 1 selon la clé de répartition. je souhaite récupérer ces données via ma boîte email. aussi que si le captcha n'est pas correct que l'envoi n'ait pas lieu. merci . j'ai assez parlé et voici le code et merci de m'aider:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Renouvellement du bureau de l'AG : Vote en ligne</title>
<SCRIPT language="JavaScript"><!--

// Formatage d'un champs mail(interdiction de quel que caractair)
function valid_mail(evt) {
var keyCode = evt.which ? evt.which : evt.keyCode;
var interdit = 'àâäãçéèêëìîïòôöõùûüñ &*?!:;,\t#~"^¨%$£?²¤§%*()[]{}<>|\\/'\'';
if (interdit.indexOf(String.fromCharCode(keyCode)) >= 0) {
return false;
}
}



function verif() //écriture de la fonction

{ var bool=true;

//var f1='document.form1';
var str = document.form1.email.value;

var regexp = new RegExp("^[a-zA-Z0-9_\\-\\.]{3,}@[a-zA-Z0-9\\-_]{2,}\\.[a-zA-Z]{2,4}$", "g");

if(bool){//debut

//Control de validité de la Nom et du prenom.
if (document.form1.prenom.value==""){//debut

alert("Votre prénom doit nous etre fourni!");
document.form1.prenom.focus();
bool=false;
}//fin

//Control de validité du Nom et du prenom.
if (document.form1.nom.value==""){//debut

alert("Votre nom doit nous etre fourni!");
document.form1.nom.focus();
bool=false;
}//fin

//Control de validité du mail.
if(!regexp.test(str) || str=="") {//debut
alert("L'adresse e-mail n'est pas valide ! "+document.form1.email.value);
document.form1.email.focus();
bool=false;
}//fin


}//fin

//On active le bouton submit du formulaire.
if(bool==true){document.form1.submit();}


} // -->

</script>
<style type="text/css">
<!--
.Style2 {
color: #FFFF33;
font-size: 36px;
font-family: Georgia, "Times New Roman", Times, serif;
}
.Style3 {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
}
.Style4 {color: #FFFFFF}
body {
background-color: #000000;
}
.Style6 {
color: #FFFF33;
font-size: 24px;
font-family: "Times New Roman", Times, serif;
}
.Style7 {color: #CC0000}
.Style12 {font-family: Arial, Helvetica, sans-serif; font-size: 12; }
a:link {
color: #FFFFFF;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #FFFFFF;
}
a:hover {
text-decoration: none;
color: #999999;
}
a:active {
text-decoration: none;
color: #999999;
}
.Style14 {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
}
-->
</style>
</head>

<body>
<p> </p>
<table width="93%" border="2" cellspacing="2" cellpadding="2">
<tr>
<td width="18%" valign="top" bgcolor="#CCFF99"><table width="100%" border="2" cellpadding="7" cellspacing="7" bgcolor="#CCFF99">
<tr>
<td bordercolor="#CCFF99"><span class="Style12">BIENVENUE SUR LE SYSTEME DE VOTE </span></td>
</tr>
<tr>
<td bordercolor="#CCFF99"><hr /></td>
</tr>
<tr>
<td align="left" bordercolor="#CCFF99" bgcolor="#CC6666"><span class="Style14"><a href="instruction.html">Lire les instructions de vote avant de commencer</a> </span></td>
</tr>
<tr>
<td align="left" bordercolor="#CCFF99"><hr /></td>
</tr>
<tr>
<td align="left" bordercolor="#CCFF99" bgcolor="#000000"><span class="Style14"><a href="index.php">CLIQUEZ ICI POUR VOTER </a></span></td>
</tr>
<tr>
<td bordercolor="#CCFF99" bgcolor="#CCFF99"><hr /></td>
</tr>
<tr>
<td bordercolor="#CCFF99" bgcolor="#FF0000"><span class="Style12"><strong>Il est obligatoire de confirmer votre vote par une signature electronique avant la soumission de vos choix par </strong></span></td>
</tr>
</table></td>
<td width="82%"><table width="99%" border="0" align="center" cellpadding="4" cellspacing="4">
<tr bgcolor="#000000">
<td align="center" bgcolor="#000000"><span class="Style6">Renouvellement du bureau de l'AG / Vote online </span></td>
</tr>
<tr>
<td><form action="verify.php" method="post" name="form1" id="form1">
<table width="100%" border="0" align="center" cellpadding="4" cellspacing="4" bordercolor="#FFFFFF">
<tr>
<td width="23%" height="35" bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7">Prenom</span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7">
<label>
<input type="text" name="prenom" id="prenom" size="35"/>
</label>
</span></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7">Nom</span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#FFFFFF"><input name="nom" type="text" id="nom" size="35" /></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7">Email</span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#FFFFFF"><input name="email" type="text" id="email" size="size"></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7"></span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7"></span></td>
</tr>
<tr>
<td align="center" bordercolor="#CCFF66" bgcolor="#CC0000"><span class="Style4"> Zone Amerique Latine </span></td>
<td width="23%" align="center" bordercolor="#CCFF66" bgcolor="#CC0000"><span class="Style4">clé de répartition : 2 </span></td>
<td width="54%" valign="bottom" bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><label>
<input type="checkbox" name="zalcandidat1" id="zalcandidat1" value="checkbox" />
</label></td>
<td align="center"><input type="checkbox" name="zalcandidat2" id="zalcandidat2" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zalcandidat3" id="zalcandidat3" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zalcandidat4" id="zalcandidat4" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zalcandidat5" id="zalcandidat5" value="checkbox" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#663300"><span class="Style4">Zone Amerique du Nord </span></td>
<td bordercolor="#CCFF66" bgcolor="#663300"><span class="Style4">clé de répartition : 2</span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><label>
<input type="checkbox" name="zancandidat1" id="zancandidat1" value="checkbox" />
</label></td>
<td align="center"><input type="checkbox" name="zancandidat2" id="zancandidat2" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zancandidat3" id="zancandidat3" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zancandidat4" id="zancandidat4" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zancandidat5" id="zancandidat5" value="checkbox" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#FF6600"><span class="Style4">Zone Europe </span></td>
<td bordercolor="#CCFF66" bgcolor="#FF6600"><span class="Style4">clé de répartition : 1 </span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><label>
<input type="checkbox" name="zecandidat1" id="zecandidat1" value="checkbox" />
</label></td>
<td align="center"><input type="checkbox" name="zecandidat2" id="zecandidat2" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zecandidat3" id="zecandidat3" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zecandidat4" id="zecandidat4" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zecandidat5" id="zecandidat5" value="checkbox" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#666633"><span class="Style4">Zone Asie </span></td>
<td bordercolor="#CCFF66" bgcolor="#666633"><span class="Style4">clé de répartition : 1</span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><label>
<input type="checkbox" name="zacandidat1" id="zacandidat1" value="checkbox" />
</label></td>
<td align="center"><input type="checkbox" name="zacandidat2" id="zacandidat2" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zacandidat3" id="zacandidat3" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zacandidat4" id="zacandidat4" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zacandidat5" id="zacandidat5" value="checkbox" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#000000"><span class="Style4">Zone Afrique de l'ouest </span></td>
<td bordercolor="#CCFF66" bgcolor="#000000"><span class="Style4">clé de répartition : 2 </span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><label>
<input type="checkbox" name="zaocandidat1" id="zaocandidat1" value="checkbox" />
</label></td>
<td align="center"><input type="checkbox" name="zaocandidat2" id="zaocandidat2" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaocandidat3" id="zaocandidat3" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaocandidat4" id="zaocandidat4" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaocandidat5" id="zaocandidat5" value="checkbox" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#000000"><span class="Style4">Zone Afrique de l'Est et su sud </span></td>
<td bordercolor="#CCFF66" bgcolor="#000000"><span class="Style4">clé de répartition : 1 </span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><label>
<input type="checkbox" name="zaescandidat1" id="zaescandidat1" value="checkbox" />
</label></td>
<td align="center"><input type="checkbox" name="zaescandidat2" id="zaescandidat2" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaescandidat3" id="zaescandidat3" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaescandidat4" id="zaescandidat4" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaescandidat5" id="zaescandidat5" value="checkbox" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#FFCC00" bgcolor="#336600"><span class="Style2">Signature electronique </span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#CCFF99"><?php
require_once('recaptchalib.php');
$publickey = "6LfG-rsSAAAAAOhfsgxlghIf9rPPVBjT5Y_V4ukP"; // you got this from the signup page
echo recaptcha_get_html($publickey);
?>
 </td>
</tr>
<tr>
<td bordercolor="#FFCC00" bgcolor="#CCFF99"> </td>
<td colspan="2" align="center" bordercolor="#CCFF66" bgcolor="#CCFF99"><label>
<input type="button" name="button" id="button" onclick="verif();" value="Envoyer" />
<input type="reset" name="Submit" value="Reinitialiser" />
</label></td>
</tr>
</table>
</form></td>
</tr>
</table></td>
</tr>
</table>
<p> </p>
</body>
</html>
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
12 août 2010 à 21:47
voilà, regardes les commentaires, il te reste une partie à modifier selon le même principe
ça marche sous firefox, j'ai pas testé sous iE
je ne vois pas a quoi sert le lien "Cliquez pour voter" puisque le vote se fait pas le bouton Envoyer

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Renouvellement du bureau de l'AG : Vote en ligne</title>
<script type="text/javascript">
<!--
function verif_formulaire(){
	//fonction appelée par le onSubmit de la balise <form 
	//si elle trouve une erreur ou anomalie, message d'alert et elle return false donc le formulaire ne part pas
	//si pas d'erreur return true,, le formulaire est envoyé
	//cette fonction va verifier que le formualire est correct, nom, prenom pas vides, email pas vide et au bon format
	//et que le bon nombre de casesets coché pour chaque zone
	
	//prenom
	var champ_prenom=document.getElementById('prenom');
	if(champ_prenom.value==""){
		alert("Vous devez saisir votre prenom ! ");
		champ_prenom.focus();
		return false; //on renvoie false et on sort de la fonction
	}
	//nom
	var champ_nom=document.getElementById('nom');
	if(champ_nom.value==""){
		alert("Vous devez saisir votre nom ! ");
		champ_nom.focus();
		return false; //on renvoie false et on sort de la fonction
	}
	//email
	var champ_email=document.getElementById('email');
	if(champ_email.value==""){
		alert("Vous devez saisir votre email ! ");
		champ_email.focus();
		return false; //on renvoie false et on sort de la fonction
	}else{
		//email pas vide on verifie son format
		var regexp = new RegExp("^[a-zA-Z0-9_\\-\\.]{3,}@[a-zA-Z0-9\\-_]{2,}\\.[a-zA-Z]{2,4}$", "g");
		if(!regexp.test(champ_email.value) ) {
			alert("L'adresse e-mail n'est pas valide ! "+champ_email.value);
			champ_email.focus();
			return false; //on renvoie false et on sort de la fonction
		}	
	}
	
	//verif du nombre de cases cochées pour chaque zone
		//init variables de travail
		//compteurs pour chaque zone
		var cpt_zalcandidat=0;
		var cpt_zancandidat=0;
		var cpt_zecandidat=0;
		//etc.. completes pour les autres zones
		
		//
	  var form = document.forms.form1;
	for (i=0 ; i<= form.length-1 ; i++){
		//on parcours tous les elements du formulaire
		if (form[i].type == 'checkbox' ) {
			//on teste si c'est une checkbox
			//puis on compte combien sont cochées pour chaque zone en regardant le name
			if(form[i].name =='zalcandidat' && form[i].checked==true){
				cpt_zalcandidat ++; //si cochée on incremente le compteur correspondant
			}
			if(form[i].name =='zancandidat' && form[i].checked==true){
				cpt_zancandidat ++; //si cochée on incremente le compteur correspondant
			}
			if(form[i].name =='zecandidat' && form[i].checked==true){
				cpt_zecandidat ++; //si cochée on incremente le compteur correspondant
			}
			
			//etc.. completes pour les autres zones
			
			
		}
	}
	
	//ensuite on regarde les compteurs des zones
	if(cpt_zalcandidat == 0 || cpt_zalcandidat > 2){
		alert("Vous devez cocher 2 candidats pour la zone Amerique latine !");
		return false;	
	}
	if(cpt_zancandidat == 0 || cpt_zancandidat > 2){
		alert("Vous devez cocher 2 candidats pour la zone Amerique du Nord !");
		return false;	
	}
	if(cpt_zecandidat == 0 || cpt_zecandidat > 2){
		alert("Vous devez cocher 2 candidats pour la zone Europe !");
		return false;	
	}
	
	//etc... tu completes pour les autres zones



	//si on est arrivé la c'est qu'il n'y a pas d'erruer donc on return true et le formulaire partira
	return true;
}
</script>
<style type="text/css">
<!--
.Style2 {
color: #FFFF33;
font-size: 36px;
font-family: Georgia, "Times New Roman", Times, serif;
}
.Style3 {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
}
.Style4 {color: #FFFFFF}
body {
background-color: #000000;
}
.Style6 {
color: #FFFF33;
font-size: 24px;
font-family: "Times New Roman", Times, serif;
}
.Style7 {color: #CC0000}
.Style12 {font-family: Arial, Helvetica, sans-serif; font-size: 12; }
a:link {
color: #FFFFFF;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #FFFFFF;
}
a:hover {
text-decoration: none;
color: #999999;
}
a:active {
text-decoration: none;
color: #999999;
}
.Style14 {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
}
-->
</style>
</head>

<body>
<p> </p>
<table width="93%" border="2" cellspacing="2" cellpadding="2">
<tr>
<td width="18%" valign="top" bgcolor="#CCFF99"><table width="100%" border="2" cellpadding="7" cellspacing="7" bgcolor="#CCFF99">
<tr>
<td bordercolor="#CCFF99"><span class="Style12">BIENVENUE SUR LE SYSTEME DE VOTE </span></td>
</tr>
<tr>
<td bordercolor="#CCFF99"><hr /></td>
</tr>
<tr>
<td align="left" bordercolor="#CCFF99" bgcolor="#CC6666"><span class="Style14"><a href="instruction.html">Lire les instructions de vote avant de commencer</a> </span></td>
</tr>
<tr>
<td align="left" bordercolor="#CCFF99"><hr /></td>
</tr>
<tr>
<td align="left" bordercolor="#CCFF99" bgcolor="#000000"><span class="Style14"><a href="index.php">CLIQUEZ ICI POUR VOTER </a></span></td>
</tr>
<tr>
<td bordercolor="#CCFF99" bgcolor="#CCFF99"><hr /></td>
</tr>
<tr>
<td bordercolor="#CCFF99" bgcolor="#FF0000"><span class="Style12"><strong>Il est obligatoire de confirmer votre vote par une signature electronique avant la soumission de vos choix par </strong></span></td>
</tr>
</table></td>
<td width="82%"><table width="99%" border="0" align="center" cellpadding="4" cellspacing="4">
<tr bgcolor="#000000">
<td align="center" bgcolor="#000000"><span class="Style6">Renouvellement du bureau de l'AG / Vote online </span></td>
</tr>
<tr>
<td>
<form action="verify.php" method="post" name="form1" id="form1" onSubmit="return verif_formulaire();">
<table width="100%" border="0" align="center" cellpadding="4" cellspacing="4" bordercolor="#FFFFFF">
<tr>
<td width="23%" height="35" bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7">Prenom</span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7">
<label>
<input type="text" name="prenom" id="prenom" size="35"/>
</label>
</span></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7">Nom</span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#FFFFFF"><input name="nom" type="text" id="nom" size="35" /></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7">Email</span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#FFFFFF"><input name="email" type="text" id="email" size="size"></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7"></span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#FFFFFF"><span class="Style7"></span></td>
</tr>
<tr>
<td align="center" bordercolor="#CCFF66" bgcolor="#CC0000"><span class="Style4"> Zone Amerique Latine </span></td>
<td width="23%" align="center" bordercolor="#CCFF66" bgcolor="#CC0000"><span class="Style4">clé de répartition : 2 </span></td>
<td width="54%" valign="bottom" bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="zalcandidat" id="zalcandidat1" value="zalcandidat1" /></td>
<td align="center"><input type="checkbox" name="zalcandidat" id="zalcandidat2" value="zalcandidat2" /></td>
<td align="center"><input type="checkbox" name="zalcandidat" id="zalcandidat3" value="zalcandidat3" /></td>
<td align="center"><input type="checkbox" name="zalcandidat" id="zalcandidat4" value="zalcandidat4" /></td>
<td align="center"><input type="checkbox" name="zalcandidat" id="zalcandidat5" value="zalcandidat5" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#663300"><span class="Style4">Zone Amerique du Nord </span></td>
<td bordercolor="#CCFF66" bgcolor="#663300"><span class="Style4">clé de répartition : 2</span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="zancandidat" id="zancandidat1" value="zancandidat1" /></td>
<td align="center"><input type="checkbox" name="zancandidat" id="zancandidat2" value="zancandidat2" /></td>
<td align="center"><input type="checkbox" name="zancandidat" id="zancandidat3" value="zancandidat3" /></td>
<td align="center"><input type="checkbox" name="zancandidat" id="zancandidat4" value="zancandidat4" /></td>
<td align="center"><input type="checkbox" name="zancandidat" id="zancandidat5" value="zancandidat5" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#FF6600"><span class="Style4">Zone Europe </span></td>
<td bordercolor="#CCFF66" bgcolor="#FF6600"><span class="Style4">clé de répartition : 1 </span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="zecandidat" id="zecandidat1" value="zecandidat1" /></td>
<td align="center"><input type="checkbox" name="zecandidat" id="zecandidat2" value="zecandidat2" /></td>
<td align="center"><input type="checkbox" name="zecandidat" id="zecandidat3" value="zecandidat3" /></td>
<td align="center"><input type="checkbox" name="zecandidat" id="zecandidat4" value="zecandidat4" /></td>
<td align="center"><input type="checkbox" name="zecandidat" id="zecandidat5" value="zecandidat5" /></td>
</tr>

<!-- modifies ci dessous les input des autres zones comme fait ci dessus -->

</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#666633"><span class="Style4">Zone Asie </span></td>
<td bordercolor="#CCFF66" bgcolor="#666633"><span class="Style4">clé de répartition : 1</span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><label>
<input type="checkbox" name="zacandidat1" id="zacandidat1" value="checkbox" />
</label></td>
<td align="center"><input type="checkbox" name="zacandidat2" id="zacandidat2" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zacandidat3" id="zacandidat3" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zacandidat4" id="zacandidat4" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zacandidat5" id="zacandidat5" value="checkbox" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#000000"><span class="Style4">Zone Afrique de l'ouest </span></td>
<td bordercolor="#CCFF66" bgcolor="#000000"><span class="Style4">clé de répartition : 2 </span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><label>
<input type="checkbox" name="zaocandidat1" id="zaocandidat1" value="checkbox" />
</label></td>
<td align="center"><input type="checkbox" name="zaocandidat2" id="zaocandidat2" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaocandidat3" id="zaocandidat3" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaocandidat4" id="zaocandidat4" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaocandidat5" id="zaocandidat5" value="checkbox" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#CCFF66" bgcolor="#000000"><span class="Style4">Zone Afrique de l'Est et su sud </span></td>
<td bordercolor="#CCFF66" bgcolor="#000000"><span class="Style4">clé de répartition : 1 </span></td>
<td bordercolor="#CCFF66" bgcolor="#CCFF99"><table width="99%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td><span class="Style3">CANDIDAT1</span></td>
<td><span class="Style3">CANDIDAT2</span></td>
<td><span class="Style3">CANDIDAT3</span></td>
<td><span class="Style3">CANDIDAT4</span></td>
<td><span class="Style3">CANDIDAT5</span></td>
</tr>
<tr>
<td align="center"><label>
<input type="checkbox" name="zaescandidat1" id="zaescandidat1" value="checkbox" />
</label></td>
<td align="center"><input type="checkbox" name="zaescandidat2" id="zaescandidat2" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaescandidat3" id="zaescandidat3" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaescandidat4" id="zaescandidat4" value="checkbox" /></td>
<td align="center"><input type="checkbox" name="zaescandidat5" id="zaescandidat5" value="checkbox" /></td>
</tr>
</table></td>
</tr>
<tr>
<td bordercolor="#FFCC00" bgcolor="#336600"><span class="Style2">Signature electronique </span></td>
<td colspan="2" bordercolor="#CCFF66" bgcolor="#CCFF99"><?php
require_once('recaptchalib.php');
$publickey = "6LfG-rsSAAAAAOhfsgxlghIf9rPPVBjT5Y_V4ukP"; // you got this from the signup page
echo recaptcha_get_html($publickey);
?>
 </td>
</tr>
<tr>
<td bordercolor="#FFCC00" bgcolor="#CCFF99"> </td>
<td colspan="2" align="center" bordercolor="#CCFF66" bgcolor="#CCFF99"><label>
<!-- il faut que le bouton soit du type submit et pas de onClick, la fonction est appelée dans la balise <form par le onSubmit="return .... -->
<input type="submit" name="envoyer" id="envoyer" value="Envoyer" />
<input type="reset" name="reset" value="Reinitialiser" />
</label></td>
</tr>
</table>
</form></td>
</tr>
</table></td>
</tr>
</table>
<p> </p>
</body>
</html>
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
merci à alain_42 pour cette contribution, j'avoue que j'ai bavé pour y arriver (en ce qui concerne les modifications à faire sur les diff&érentes parties). mais là, il se pose deux autres problèmes:

1) mon captcha ne fait absolument rien du tout car si je valide après avoir correctement rempli le formulaire (le formulaire s'en va sans contrôle du captcha).

2) sur IE, dès que j'ai rentré le prénom, nom et adresse et que je valide, le formulaire s'en va aussi. ce qui veut dire que mon script ne passe pas sur IE. comment faire pour que cela passe ? merci et comment résoudre le pb de captcha
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
13 août 2010 à 20:35
concernant le capcha je ne l'ai pas vu dans ton code et je ne pense pas qu'il soit verifié au niveau de javascript avant l'envoi mais plutôt en php dans le script appelé

sur IE 7 je n'arrive même pas à afficher la page de formulaire ! il doit y avoir un pb dans le code html mais je ne vois pas lequel ?
0
chanelson Messages postés 8 Date d'inscription vendredi 13 août 2010 Statut Membre Dernière intervention 20 octobre 2010
15 août 2010 à 03:26
je crois qu'il y a effectivement un problème car même sur le IE 6.0 il ne s'affiche pas. en regardant bien le code je me suis rendu compte d'un < devant un <tr> quelque part. malgré ça , ça ne passe toujours pas. je ne sais pas pourquoi.
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
15 août 2010 à 18:07
je t'ai répondu sur ton message en mp, avec la solution au pb avec IE
0