[SOLUCIONADO] Validar dos inputs con Javascript

[Nass]

Hola chicos, como habéis visto algunos hace poco, estoy haciendo un sitio web que me han mandado en clase sobre sacar billetes de buses en php

Estoy teniendo un problema con validar dos campos input con Javascript, este es el código:

<script src='js/validarFormulario.js' type='text/javascript'></script>
<form name='index' id='formularioReg' enctype='multipart/form-data' onsubmit='return validarForm(this);' action='index.php' method='post'>
<table border='0px' class='block-centrado' style='text-align:center;' width='400px' cellspacing='20'>
<tr><td><h2>Origen:</td><td><input type='text' id='origen' name='origen' style='width: 170px;' value='' size='15'>
<tr><td><h2>Destino:</td><td><input type='text' id='destino' name='destino' style='width: 170px;' value='' size='15'>
<tr><td id='td-boton' colspan='2'><input type='submit' name='cmdNuevo' onclick='enviarFormulario('formularioReg');' value='&nbsp;Buscar&nbsp;' style='width:290px; height:50px; font-size: 22px;'/></td></tr>

El código Javascript:

function validarForm(index) {

//----------------Validacion orígen-----------------//
if(index.origen.value.length==0 ) {
index.origen.focus(); // Damos el foco al control
alert('Debe escribir el or\u00EDgen.'); //Mostramos el mensaje
return false; //devolvemos el foco
}

//----------------Validacion destino-----------------//
if(index.destino.value.length==0 ) {
index.destino.focus(); // Damos el foco al control
alert('Debe escribir el destino.'); //Mostramos el mensaje
return false; //devolvemos el foco
}

//----------------Validacion ciudades de origen-----------------//
if ((index.origen.value == "pontevedra") || (index.origen.value == "cantabria") || (index.origen.value == "vizcaya")
|| (index.origen.value == "la rioja") || (index.origen.value == "leon") || (index.origen.value == "palencia")
|| (index.origen.value == "burgos") || (index.origen.value == "zaragoza") || (index.origen.value == "lleida") || (index.origen.value == "barcelona")
|| (index.origen.value == "madrid") || (index.origen.value == "sevilla") || (index.origen.value == "a coru\u00F1a") || (index.origen.value == "lugo")
|| (index.origen.value == "ourense") || (index.origen.value == "asturias") || (index.origen.value == "guipuzcoa") || (index.origen.value == "alava")
|| (index.origen.value == "navarra") || (index.origen.value == "valladolid") || (index.origen.value == "zamora") || (index.origen.value == "soria")
|| (index.origen.value == "segovia") || (index.origen.value == "salamanca") || (index.origen.value == "avila") || (index.origen.value == "huesca")
|| (index.origen.value == "teruel") || (index.origen.value == "tarragona") || (index.origen.value == "girona") || (index.origen.value == "castellon")
|| (index.origen.value == "valencia") || (index.origen.value == "alicante") || (index.origen.value == "murcia") || (index.origen.value == "guadalajara")
|| (index.origen.value == "cuenca") || (index.origen.value == "toledo") || (index.origen.value == "ciudad real") || (index.origen.value == "albacete")
|| (index.origen.value == "caceres") || (index.origen.value == "cordoba") || (index.origen.value == "jaen") || (index.origen.value == "huelva")
|| (index.origen.value == "granada") || (index.origen.value == "almeria") || (index.origen.value == "malaga") || (index.origen.value == "cadiz")
|| (index.origen.value == "badajoz")){
return true;
}
else{
alert("Por favor, escriba una ciudad espa\u00F1ola como destino sin may\u00FAsculas ni t\u00EDldes.");
return false;
}


//----------------Validacion ciudades de destino-----------------//
if ((index.destino.value == "pontevedra") || (index.destino.value == "cantabria") || (index.destino.value == "vizcaya")
|| (index.destino.value == "la rioja") || (index.destino.value == "leon") || (index.destino.value == "palencia")
|| (index.destino.value == "burgos") || (index.destino.value == "zaragoza") || (index.destino.value == "lleida") || (index.destino.value == "barcelona")
|| (index.destino.value == "madrid") || (index.destino.value == "sevilla") || (index.destino.value == "a coru\u00F1a") || (index.destino.value == "lugo")
|| (index.destino.value == "ourense") || (index.destino.value == "asturias") || (index.destino.value == "guipuzcoa") || (index.destino.value == "alava")
|| (index.destino.value == "navarra") || (index.destino.value == "valladolid") || (index.destino.value == "zamora") || (index.destino.value == "soria")
|| (index.destino.value == "segovia") || (index.destino.value == "salamanca") || (index.destino.value == "avila") || (index.destino.value == "huesca")
|| (index.destino.value == "teruel") || (index.destino.value == "tarragona") || (index.destino.value == "girona") || (index.destino.value == "castellon")
|| (index.destino.value == "valencia") || (index.destino.value == "alicante") || (index.destino.value == "murcia") || (index.destino.value == "guadalajara")
|| (index.destino.value == "cuenca") || (index.destino.value == "toledo") || (index.destino.value == "ciudad real") || (index.destino.value == "albacete")
|| (index.destino.value == "caceres") || (index.destino.value == "cordoba") || (index.destino.value == "jaen") || (index.destino.value == "huelva")
|| (index.destino.value == "granada") || (index.destino.value == "almeria") || (index.destino.value == "malaga") || (index.destino.value == "cadiz")
|| (index.destino.value == "badajoz")){
return true;
}
else{
alert("Por favor, escriba una ciudad espa\u00F1ola como destino sin may\u00FAsculas ni t\u00EDldes.");
return false;
}


}

El problema me surje con la validación de ciudades de destino, no me funciona y creo que es porque está antes el de validar ciudades de origen que es demasiado largo el if o no lo se, por eso acudo a vosotros

Cualquier ayuda será bienvenida y gracias de antemano

[caricatos]

Hola:

No entiendo tu aplicación, ya que si seleccionas las ciudades (creo que en realidad te refieres a provincias) pinchando sobre un mapa; si pones el control "readonly", no se podrá modificar a no ser que haya sido rellenado con esa pulsación; así que bastaría con controlar que los campos no estén vacíos y que sean diferentes.

Otra cosa es que tienes errores de ortografía ya que muchas de esas provincias se acentúan (Málaga, Cáceres, Ávila...) y se capitalizan (con mayúsculas)

Como respuesta, yo suelo crear un array (con las provincias) y un método in_array (como el de php), que se implementa con bastante fácilidad.

Saludos

[0123]

Buenas Nass,

Veo un poco compleja la forma de validar las provincias. ¿Has pensado en realizar un select con unas provincias con identificadores numericos?, es que me parece muy inestable pedir al usuario que escriba algo tan sensible a errores.

De todas las formas posibles de hacerlo, la de poner un input text es un poco locura. En caso de querer aun hacerlo de ese modo, yo crearia un autocomplete con un datalist con las posibilidades. O mejor aun, haciendo uso de AJAX y desplegando bajo el campo las posiblidades. Esta ultima seria una gran elección.

Pero como un simple select... no hay nada :D

Siento no ayudarte, he probado el codigo y parece ir bien. En chrome en mac. Pero me parece la forma más compleja de realizar un formulario de este tipo.

Un saludo!

[Nass]

Hola chicos os agradezco mucho las respuestas pero veréis, en ese formulario junto a cada input está puesta una imagen que al darle click abre un mapa de España en la cual se elige la provincia, el mapa es Javascript y al clickear una ciudad ésta se pone en el cuadro de texto, entonces puesto que las ciudades que vienen en el mapa están en minuscula las he cogido tal como vienen en el mapa y las he validado en Javascript para que sólo acepte las palabras que tiene el mapa, podría haber usado php pero me han dicho que use Javascipt para que antes de ejecutarse el php me valide los errores y me los saque en una ventanita..la otra forma sería la de en vez de mandar la provincia desde el mapa al input mandarsela a una variable php y mostrarla simplemente pero ya he intentado hacer eso con alguna cosilla que me han dicho sin resultado.
Espero haberme explicado mejor xD

Saludoos¡¡

[programajin]

si buena opcion el javascript es mas rapido para validar que haciendo una llamada al servidor, saludos!

[caricatos]

Hola:

Tu respuesta confirma mi respuesta... tómate un tiempecito y reflexiona...

Saludos

[Nass]

Vale chicos lo acabo de solucionar con un hidden :P
Lo que he echo basicamente ha sido al recibir el dato en el input, el input estará desactivado para que así nadie pueda modificarlo y su función será solo visualizar al cliente la ciudad que ha escogido del mapa, PERO, también he puesto que el mapa desde Javascript aparte de mandarle al input text el dato se lo mande a un input hidden y así uno visualizará y con el otro viajará la ciudad con POST.

Gracias por vuestros comentarios chicos, de verdad me estáis ayudando mucho¡¡
Un gran saludo¡¡

[0123]

Ayba... no habia leido que era un mapa clicable, jeje... sorry...

[Nass]

jaja no te preocupes ya está solucionado el tema y gracias por vuestros comentarios.
Saludos