#1 Le 16/04/2008, à 21:11
- estelle27K
Pb de validation d'un formulaire html/php via du Javascript
Bonsoir
je souhaite valider ce formulaire html/php via un script en JS
<?php session_start(); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>MP3 Island - Enregistrez vous !! </title>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<link rel="stylesheet" href="styles-heet.css" type="text/css" />
<script src="/mp3island/javascript/verif_champ.js" language="JavaScript" type="text/JavaScript"></script>
</head>
<body><div class="top">
<p align="left"><?php include("top.php"); ?> </p>
</div>
<center>
<br>
<br>
<div id="formInscrip">
<b>REMPLIR LE FORMULAIRE SVP</b>
<div id="formInscip1">
<form action="#">
<p><label for="userName">Votre nom : <input type="text" size="30" id="userName" class="reqd" /></label></p><br>
<p><label for="lastName">Votre prenom : <input type="text" size="30" id="lastName" class="reqd" /></label></p><br>
<p><label for="pseudoName">Votre pseudo : <input type="text" size="30" id="pseudoName" class="reqd" /></label></p><br>
<p><label for="mail">Votre e-Mail : <input type="text" size="30" id="mail" class="reqd email" /></label></p><br>
<p><label for="passwd1">Votre Mot de passe : <input type="password" id="passwd1" class="reqd"></label></p><br>
<p><label for="passwd2">Retapez votre Mot de passe : <input type="password" id="passwd2" class="reqd passwd1"></label></p><br>
<p><label for="dateNais">Votre date de naissance :<select id="months">
<option value="0">01</option>
<option value="1">02</option>
<option value="2">03</option>
<option value="3">04</option>
<option value="4">05</option>
<option value="5">06</option>
<option value="6">07</option>
<option value="7">08</option>
<option value="8">09</option>
<option value="9">10</option>
<option value="10">11</option>
<option value="11">12</option>
</select>
<select id="days">
<option>01</option>
</select>
<select id="years">
<option>2008</option>
<option>2007</option>
<option>2006</option>
<option>2005</option>
<option>2004</option>
<option>2003</option>
<option>2002</option>
<option>2001</option>
<option>2000</option>
<option>1999</option>
<option>1998</option>
<option>1997</option>
<option>1996</option>
<option>1995</option>
<option>1994</option>
<option>1993</option>
<option>1992</option>
<option>1991</option>
<option>1990</option>
<option>1989</option>
<option>1988</option>
<option>1987</option>
<option>1986</option>
<option>1985</option>
<option>1984</option>
<option>1983</option>
<option>1982</option>
<option>1981</option>
<option>1980</option>
<option>1979</option>
<option>1978</option>
<option>1977</option>
<option>1976</option>
<option>1975</option>
<option>1974</option>
<option>1973</option>
<option>1972</option>
<option>1971</option>
<option>1970</option>
<option>1969</option>
<option>1968</option>
<option>1967</option>
<option>1965</option>
<option>1964</option>
<option>1963</option>
<option>1962</option>
<option>1961</option>
<option>1960</option>
<option>1959</option>
<option>1958</option>
<option>1957</option>
<option>1956</option>
<option>1955</option>
<option>1954</option>
<option>1953</option>
<option>1952</option>
<option>1951</option>
<option>1950</option>
</select></label></p>
<br><br>
<center><p><input type="submit" value="Soumettre"/> <input type="reset" value="Effacer"/></p></center>
</form>
</div>
<h6>*Veuillez remplir tous les champs svp.</h6>
</div>
</center>
</body>
</html>
le script que j'ai écrit
window.onload = initForms;
window.onload = initForm;function initForm() {
document.getElementById("months").selectedIndex = 0;
document.getElementById("months").onchange = populateDays;
}function populateDays() {
var monthDays = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
var monthStr = this.options[this.selectedIndex].value;
if (monthStr != "") {
var theMonth = parseInt(monthStr);
document.getElementById("days").options.length = 0;
for(var i=0; i<monthDays[theMonth]; i++) {
document.getElementById("days").options[i] = new Option(i+1);
}
}
}function initForms() {
for (var i=0; i< document.forms.length; i++) {
document.forms[i].onsubmit = function() {return validForm();}
}
}function validForm() {
var allGood = true;
var allTags = document.getElementsByTagName("*");
for (var i=0; i<allTags.length; i++) {
if (!validTag(allTags[i])) {
allGood = false;
}
}
return allGood;
function validTag(thisTag) {
var outClass = "";
var allClasses = thisTag.className.split(" ");
for(var j=0; j<allClasses.length; j++) {
outClass += validBasedOnClass(allClasses[j]) + " ";
}
thisTag.className = outClass;
if (outClass.indexOf("invalid") > -1) {
invalidLabel(thisTag.parentNode);
thisTag.focus();
if (thisTag.nodeName == "INPUT"){
thisTag.select();
}
return false;
}
return true;
function validBasedOnClass(thisClass) {
var classBack = "";
switch(thisClass) {
case "":
case "invalid":
break;
case "reqd":
if (allGood && thisTag.value=="") classBack = "invalid";
classBack += thisClass;
break;
default:
if (allGood && !crossCheck(thisTag,thisClass)) classBack = "invalid";
classBack += thisClass;
}
return classBack;
}
function crossCheck(inTag,otherFieldID) {
if (!document.getElementById(otherFieldID)) return false;
return (inTag.value == document.getElementById(otherFielID).value);
}
function invalidLabel(parentTag) {
if (parentTag.nodeName == "LABEL") {
parentTag.className += "invalid";
}
}
function validEmail(email) {
var re = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
return re.test(email);
}
}
}
mais ca marche pas , pourtant je vois pas d'erreurs
merci de bien vouloir m'aider