JavaScript - formulario html + php validar javascript

 
Vista:

formulario html + php validar javascript

Publicado por vivv (1 intervención) el 11/10/2007 03:32:42
Hola a todos :

Tengo un formulario de envío de Email en HTML que envía la información a un PHP ( este a la vez a una de agradecimento) Esto funciona todo bien.
Pero ahora quisera validar con javascript 5 de estos campos , antes de que envie al php , probe algunos pero si o me da error en un lado me lo da en otro... :/ no tengo mucha idea de esto

Necesitaria validar solo estos campos : (Full Name--name* /// email* ///Arrival date--Arrival* //Number Of People-- NumberOfPeople ///Spanish Course --SpanishCourse /// en estos dos ultimos que son listas todo lo que probe no salio)

Mi formulario html es el siguiente:
<form action="maill.php" method="post" name="formulario" id="formulario">
<table width="445" border="0" align="center" cellspacing="0" bordercolor="#F4F4F4" background="imagenes formulario Presupuesto/fondo-entero.png">
<tr>
<td width="5" rowspan="3" align="right"><div align="left"></div></td>
<td width="215" align="right" class="tah12">*Full name:</td>
<td width="219"><div align="left">
<input name="name" type="text" class="style22" id="subject" size="39" maxlength="100" />
</div></td>
</tr>
<tr>
<td align="right" class="tah12">*Email:</td>
<td><div align="left">
<input name="email" type="text" class="style22" id="email" size="39" maxlength="250" />
</div></td>
</tr>
<tr>
<td align="right" class="tah12">*Country:</td>
<td><div align="left">
<input name="Country" type="text" class="style22" id="Country" size="25" maxlength="100" />
</div></td>
</tr>
<br />
<br />
<tr>
<td align="right" class="style22"> </td>
<td align="right" class="tah12">*Arrival date (approx):</td>
<td><div align="left">
<input name="Arrival" type="text" class="style22" id="pais" size="39" maxlength="100" />
</div></td>
</tr>
<br />
<tr>
<td align="right" class="style22"> </td>
<td align="right" class="tah12">Departure date (approx):</td>
<td><div align="left">
<input name="Departure" type="text" class="style22" id="tel" size="39" maxlength="100" />
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td align="right"> </td>
<td>-----------------------------------</td>
</tr>
<tr>
<td colspan="3" align="right"><div align="left"> </div></td>
</tr>
<tr>
<td rowspan="2" align="right"><div align="left"></div></td>
<td align="right" class="tah12">Number of people in group</td>
<td><div align="left">
<select name="Number of people" class="style22" id="select6">
<option>Select</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10+</option>
</select>
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td>-----------------------------------</td>
</tr>
<tr>
<td colspan="3" align="right"><div align="left"> </div></td>
</tr>
<tr>
<td rowspan="2" align="right"><div align="left"></div></td>
<td align="right" class="tah12">Spanish course</td>
<td><div align="left">
<select name="Spanish course" class="style22" id="Spanish course">
<option>Select</option>
<option>None</option>
<option>1 week</option>
<option>2 weeks</option>
<option>3 weeks</option>
<option>4 weeks</option>
<option>5+ weeks</option>
</select>
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td>-----------------------------------</td>
</tr>
<tr>
<td colspan="3" align="right"><div align="left"> </div></td>
</tr>
<tr>
<td rowspan="2" align="right"><div align="left"></div></td>
<td align="right" class="tah12">Spanish level</td>
<td><div align="left">
<select name="Spanish level" class="style22" id="Spanish level">
<option>Select</option>
<option>Beginner</option>
<option>Intermediate</option>
<option>Advanced</option>
</select>
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td>-----------------------------------</td>
</tr>
<tr>
<td colspan="3" align="right"><div align="left"> </div></td>
</tr>
<tr>
<td rowspan="2" align="right"><div align="left"></div></td>
<td align="right" class="tah12">Course type</td>
<td><div align="left">
<select name="Course Type" class="style22" id="Course Type">
<option>Select</option>
<option>Group</option>
<option>Private</option>
</select>
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td>-----------------------------------</td>
</tr>
<tr>
<td colspan="3" align="right"><div align="left"> </div></td>
</tr>
<tr>
<td rowspan="2" align="right"><div align="left"></div></td>
<td align="right" class="tah12">Tango course</td>
<td><div align="left">
<select name="Tango Course" class="style22" id="Tango Course">
<option>Select</option>
<option>None</option>
<option>1 week</option>
<option>2 weeks</option>
<option>3 weeks</option>
<option>4 weeks</option>
<option>5+ weeks</option>
</select>
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td>-----------------------------------</td>
</tr>
<tr>
<td colspan="3" align="right"><div align="left"> </div></td>
</tr>
<tr>
<td rowspan="2" align="right"><div align="left"></div></td>
<td align="right" class="tah12">Accommodation</td>
<td><div align="left">
<select name="Accommodation" class="style22" id="Accommodation">
<option>Select</option>
<option>None</option>
<option>Hostel</option>
<option>2 Star Hotel</option>
<option>3 Star Hotel</option>
<option>4 Star Hotel</option>
<option>5 Star Hotel</option>
</select>
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td>-----------------------------------</td>
</tr>
<tr>
<td colspan="3" align="right"><div align="left"> </div></td>
</tr>
<tr>
<td rowspan="4" align="right"><div align="left"></div></td>
<td colspan="2" align="right" class="style22"><div align="left" class="style6">Tours</div></td>
</tr>
<tr>
<td colspan="2" align="right" class="style22"><div align="left">
<p><br />
<span class="tah12">What tours are you interested in taking while here? Allow approximately one week for each destination.</span></p>
</div></td>
</tr>
<tr>
<td align="right" class="style22"> </td>
<td><div align="left">
<select name="Destination" class="style22" id="Destination">
<option>Select</option>
<option>none</option>
<option>Bariloche</option>
<option>Bariloche + Skiing </option>
<option>Buenos Aires</option>
<option>Iguazu Waterfalls</option>
<option>Mendoza wine region</option>
<option>Ushuaia and Calafate</option>
<option>Whale Watching</option>
<option>Other</option>
</select>
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td> </td>
</tr>
<tr>
<td align="right"> </td>
<td align="right" class="tah12">Tour Transport</td>
<td><div align="left">
<select name="Transport" class="style22" id="Transport">
<option>Select</option>
<option>Coach</option>
<option>Fly</option>
</select>
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td align="right"> </td>
<td>-----------------------------------</td>
</tr>
<tr>
<td rowspan="5" align="right"><div align="left"></div></td>
<td colspan="2" align="right" class="style22"><div align="left" class="style6">CTL Sports</div></td>
</tr>
<tr>
<td colspan="2" align="right" class="style22"><div align="left">
<p> </p>
</div></td>
</tr>
<tr>
<td align="right" class="style22"><div align="left" class="tah12">What sports are you interested in doing while you are here?</div></td>
<td><div align="left">
<select name="Sports" class="style22" id="Sports">
<option>Select</option>
<option>None</option>
<option>Golf</option>
<option>Tennis</option>
<option>Sailing</option>
<option>Fishing</option>
<option>Other</option>
</select>
</div></td>
</tr>
<tr>
<td align="right"> </td>
<td> </td>
</tr>
<tr>
<td colspan="2" align="right"><div align="left" class="tah12">Are you interested in our Athlete training program? (if yes please provide comments below)</div></td>
</tr>
<tr>
<td align="right"> </td>
<td align="right" class="style22"> </td>
<td><div align="left">
<label>
<input name="Athlete Program_yes" type="checkbox" id="Athlete Program_yes" value="si" />
<span class="style22"> Yes</span></label>
</div>
<label>
<input name="Athlete ProgramNo" type="checkbox" id="Athlete ProgramNo" value="si" />
<span class="style22">No</span><br />
</label>
<label></label></td>
</tr>
<tr>
<td align="right"> </td>
<td align="right"> </td>
<td>-----------------------------------</td>
</tr>
<tr>
<td align="right"> </td>
<td colspan="2" align="right"><div align="left"><span class="style6">General Comments</span><br>
<span class="tah12">Please provide any other information here:</span></div></td>
</tr>
<tr>
<td align="right" class="style22"> </td>
<td align="right" class="tah12"><p> </p>
<p><BR>
</p></td>
<td><div align="left">
<textarea name="Commentaries" cols="35" rows="8" class="style22" id="Commentaries"></textarea>
</div></td>
</tr>

<tr>
<td align="right" class="style22"> </td>
<td align="right"> </td>
<td> </td>
</tr>
<tr>
<td align="right"> </td>
<td align="right"> </td>
<td><b><font face="Verdana" size="1">
<input name="submit" type="submit" value="Send " />
</font><font face="Verdana" size="2"> </font><font face="Verdana" size="1">
<input name="reset" type="reset" value="Clear" />
</font></b></td>
</tr>
</table>
</form>
Sera mas que bienvenida alguna ayuda !!!
Gracias!!!
Viv ^^
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

RE:formulario html + php validar javascript

Publicado por weirdmix (185 intervenciones) el 26/10/2007 23:38:41
intenta con esta funcion, ponla antes de terminar el tag de headÑ
<script language="javascript" type="text/javascript">
function valida(){
var noErr=0;
var strErr="YOU MUST:\n\n";
if(formulario.name.value==""){
noErr++;
strErr+="TYPE THE NAME\n";
}
var mail=formulario.email.value;
if(mail.indexOf("@")==-1 || mail.indexOf(".")==-1 || mail.length<5){
noErr++;
strErr+="TYPE A VALID E-MAIL\n";
}
if(formulario.Arrival.value==""){
noErr++;
strErr+="TYPE THE ARRIVAL DATE\n";
}
if(formulario.numberOfPeople.options[formulario.numberOfPeople.selectedIndex].value==0){
noErr++;
strErr+="CHOOSE THE NUMBER OF PEOPLE\n";
}
if(formulario.spanishCourse.options[formulario.spanishCourse.selectedIndex].value==0){
noErr++;
strErr+="CHOOSE THE SPANISH COURSE\n";
}
if(noErr==0){
formulario.submit();
}else{
alert(strErr);
}
}
</script>

se pongo tambien los select, a los cuales les agrege la propiedad value:

<select name="numberOfPeople" class="style22" id="numberOfPeople">
<option value="0">Select</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10+</option>
</select>

<select name="spanishCourse" class="style22" id="spanishCourse">
<option value="0">Select</option>
<option value="none">None</option>
<option value="1">1 week</option>
<option value="2">2 weeks</option>
<option value="3">3 weeks</option>
<option value="4">4 weeks</option>
<option value="5">5+ weeks</option>
</select>

ademas les corregi el nombre, no puedes poner espacios, puedes poner guiones bajos o como le hice yo al puro estilo java...

saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar