Validar combobox con url

Que onda experto mira tengo un formulario conectada a mi base de datos que dentro del formulario contiene un campo de texto y un combobox.

Tengo una base de datos donde hay varios registros ingresados.

Mi campo de texto me hace una validación de si existe el numero o no me manda un mensaje de existente o viceversa no existe en mi base ya me sale bien

También tengo mi combobox donde tengo este script que me dirige a url que yo selecciono me sale bien

Este es el script:

<script>
function modForm(valor){
formulario = document.getElementById("formulario");
if(valor=='UVM'){
formulario.action=
}
if(valor=='TESE'){
formulario.action="index2.html";
}
if(valor=='IPN'){
formulario.action="index3.html";
}
if(valor=='UNAM'){
formulario.action="index4.html";
}
}
</script>

Lo que quiero es que si ingreso en mi campo de texto el numero y me manda el mensaje de no existe cuando yo selecciono una opción en mi combobox y le doy click en enviar que no me mande a ningún lado y cuando en mi campo de texto ingrese el numero y me manda el mensaje de si existe cuando yo selecciono una opción en mi combobox y le doy click en enviar me mande a la dirección que yo puse en mi script

Es que si así dejo el script tal cual como esta ahorita cuando yo pongo mi campo de texto el numero y no existe cuando selecciono una opción y le doy click enviar me lo direcciona o viceversa espero haberme explicado experto

1 respuesta

Respuesta
1

Hazlo de la siguiente manera. Pon atención a cada instrucción y trata de copiar y pegar el código tal cual esta implementado para que funcione con el menor esfuerzo posible.

Tu script de inicio se llamara index.php, contiene el formulario, algunas validaciones y la llamada por ajax para ver si existe o no el numero

Contiene jquery así que atento con eso!

<html> 
 <head>
 <title>Script de prueba</title>
 <script src="jquery.js"></script>
 <script>
 function modForm(valor){
 formulario = document.getElementById("formulario");
 if(valor=='UVM'){
 formulario.action="index1.html";
 }
 if(valor=='TESE'){
 formulario.action="index2.html";
 }
 if(valor=='IPN'){
 formulario.action="index3.html";
 }
 if(valor=='UNAM'){
 formulario.action="index4.html";
 }
 }
 $(document).ready(function(){
 $("#numero").blur(function(){
 $.ajax({
 type: "POST",
 url: "./valida_numero.php",
 data: { numero: $("#numero").val()}
 }).done(function( msg ) {
 if(msg=="true"){
 $("#Enviar").removeAttr('disabled');
 $("#txt_val").html("El numero existe");
 }else{
 $("#Enviar").prop("disabled", true);
 $("#txt_val").html("El numero no existe");
 }
 });
 });
 });
 </script>
 </head>
 <body>
 <form method="post" name="formulario" id="formulario">
 Numero
 <input type="text" name="numero" id="numero" size="10" maxlength="8">
 <div id="txt_val"></div>
 Escuela
 <select name="escuela" id="escuela" onchange="modForm(this.value)">
 <option value="">Elija escuela</option>
 <option value="UVM">UVM</option>
 <option value="TESE">TESE</option>
 <option value="IPN">IPN</option>
 <option value="UNAM">UNAM</option>
 </select>
 Enviar <input name="Enviar" type="submit" id="Enviar" value="Enviar" size="3" disabled="disabled">
 </form>
 </body>
</html>

Tu script de validación se llama valida número y tendrás que modificar los valores de conexión a la base de datos y de query para que se ejecute correctamente.

<?php
function conectarse(){
 if(!$conect=mysql_connect("localhost","usuario","password")) die ("Error en conexión a base de datos");
 if(!mysql_select_db("base_datos",$conect)) die ("Error al seleccionar base de datos");
 @mysql_query("SET NAMES 'utf8'");
 return $conect;
 }
if ($_POST){
 $conexión=conectarse();
 $resultado = mysql_query('SELECT count(*) from tabla where campo='.$_POST["numero"]);
 $fila = mysql_fetch_row($resultado);
 if($fila[0] == 1){
 echo "true";
 }else{
 echo "false";
 }
}

Lo he testeado y funciona, pon atención en los pasos a trabajar, es muy simple está todo listo para trabajar

me vas a odiar jajaja pero no me no hace nada con tu script no me validar el numero de verdad lo hago tal como tu me lo pones y nada oye y si te envío el script que si me valida el numero crees poder modificarlo nada mas para que solo se envíe cuando este en mi base de dato y cuando no este que se quede ahí mira este es mi formulario tal como esta me valida el numero si existe o no

<script type="text/javascript" src="jquery-1.3.2.js"></script>
<link href="css.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(document).ready(function() {
$('#numero').blur(function(){
$('#Info').html('<img src="loader.gif" alt="" />').fadeOut(1000);
var numero = $(this).val();
var dataString = 'numero='+numero;
$.ajax({
type: "POST",
url: "validar.php",
data: dataString,
success: function(data) {
$('#Info').fadeIn(1000).html(data);
}
});
});
});
</script>

<form name="formulario" id="formulario" action = "" method="post" >
<table width="100%" border="0">
<tr>
<td width="24%">Expediente</td>
<td width="13%"><input name="numero" type="text" id="numero" onKeyPress="return validar_texto(event)" size="10" maxlength="8"></td>
<td width="19%" height="50"><div id="Info"></div></td>
<td width="44%">
</tr>
<tr>
<td>Empresa</td>
<td><select name="escuela" id="escuela" onChange="modForm(this.value)">
<option value="" selected>Elija Empresa</option>
<option value="uvm">uvm</option>
<option value="unam">unam</option>
<option value="tese">tese</option>
</select></td>
<td height="50">&nbsp;</td>
<td> </tr>
</table>
<div id="botón">
<p>
<input name="Enviar" type="submit" style="background-color:#999999; color:#FFFFFF" id="Enviar" value="Enviar" onClick="return validarForm(this.form);"> <input name="reset" type="reset" style="background-color: #999999; color:#FFFFFF" value="Limpiar" >
</p>
<p>
</form>

validar.php

<?php
sleep(1);
include('dbcon.php');
if ($_POST){
if($_REQUEST)
{
$username = $_REQUEST['numero'];
$query = "select * from datos where numero = '".strtolower($numero)."'";
$results = mysql_query( $query) or die('ok');
if(mysql_num_rows(@$results) > 0)
{
echo '<div id="Error">Exitoso</div>';
}
else
{
echo '<div id="Success">Empleado NO existe </div>';
}
}
}?>

de verdad se que es fastidioso pero solo es esto y ya así como esta si me funciona crees poder anexar algo para que me haga lo que te pido

para no seguir molestándome solo quiero eso que cuando no este en mi base no me direccione a ningún lado pero cuando si esta me lo direccione a url que le voy a poner

Usemos el script que te envíe.

Revisa bien que las paginas existan. Valida la consola javascript y analiza la petición que se realiza por ajax y si existe algún error.

Valida que los parámetros de acceso y de base de datos son correctos. Valida que la query está con coherencia a tu modelo de base de datos.

Me tomé mi tiempo para validar ese script en función a lo que me pediste. El script funciona, solo tienes que validarlo bien e instalarlo como corresponda.

experto siento que es mi <script src="jquery-1.3.2.js"></script> no me hace nada porque lo pongo y no hace nada y lo quito tampoco y ya puse todo bien de verdad como le hago explicame para que me funcione el script

Sigue mis instrucciones... solo eso.

Primero instala tu script en un servidor y ejecutalo desde tu navegador web (ejemplo: http://localhost/script)

Usa por favor las consolas de javascript para verificar errores de sintaxis.

Revisa que todos los script estén a mismo nivel en el directorio.

Revisa la respuesta de la petición ajax para ver que te responde el servidor.

Valida todas las instrucciones de conexión a base de datos.

Esto no es solo decir que funciona o no funciona. Necesito más antecedentes para saber la falla. No puedo ir a tu escritorio a hacer tu trabajo y tienes que aprender a buscar las causantes de errores con las herramientas de debug que te ofrece el navegador.

gracias de verdad muchas gracias ya pude realizarlo ya me funciono y de maravilla si es justo lo que necesitaba y si hay que ver los error y no porque lo pegue debe de funcionar oye tengo dos dudas lo que pasa que en el script que te mande cuando validaba el numero salia una imagen que cargaba y me manda el mensaje con una imagen de una palomita crees que se pueda meter en el script que me mandaste

$('#Info').html('<img src="loader.gif" alt="" />').fadeOut(1000);

este es el que hacia como que cargaba de echo esta en el script que te mande

Intenta con esto

<html> 
 <head>
 <title>Script de prueba</title>
 <script src="jquery.js"></script>
 <script>
 function modForm(valor){
 formulario = document.getElementById("formulario");
 if(valor=='UVM'){
 formulario.action="index1.html";
 }
 if(valor=='TESE'){
 formulario.action="index2.html";
 }
 if(valor=='IPN'){
 formulario.action="index3.html";
 }
 if(valor=='UNAM'){
 formulario.action="index4.html";
 }
 }
 $(document).ready(function(){
 $("#numero").blur(function(){
 $("#imagen_carga").show();
 $.ajax({
 type: "POST",
 url: "./valida_numero.php",
 data: { numero: $("#numero").val()}
 }).done(function( msg ) {
 if(msg=="true"){
 $("#Enviar").removeAttr('disabled');
 $("#txt_val").html("El numero existe");
 $("#imagen_carga").hide();
 }else{
 $("#Enviar").prop("disabled", true);
 $("#txt_val").html("El numero no existe");
 $("#imagen_carga").hide();
 }
 });
 });
 });
 </script>
 </head>
 <body>
 <form method="post" name="formulario" id="formulario">
 <div id="imagen_carga" style="display:none"><img src="loader.gif" alt="" /></div>
 Numero
 <input type="text" name="numero" id="numero" size="10" maxlength="8">
 <div id="txt_val"></div>
 Escuela
 <select name="escuela" id="escuela" onchange="modForm(this.value)">
 <option value="">Elija escuela</option>
 <option value="UVM">UVM</option>
 <option value="TESE">TESE</option>
 <option value="IPN">IPN</option>
 <option value="UNAM">UNAM</option>
 </select>
 Enviar <input name="Enviar" type="submit" id="Enviar" value="Enviar" size="3" disabled="disabled">
 </form>
 </body>
</html>

Veras que he creado un div con la imagen de contenido y que he agregado lineas en el script que hacen show y hidden en este div para mostrar la imagen en los momentos de carga.

<div id="imagen_carga" style="display:none"><img src="loader.gif" alt="" /></div>

$("#imagen_carga").hide();

$("#imagen_carga").show();

ya puse la imagen y si me sale como si em carga pero si existe como hago queme aparezca la palomita y si no existe como hago que me aparezca un tache los dos son imágenes que tengo uno de yes.jpg y el otro es no.jpg

La función que implementamos era para hacer la idea de que estaba cargando el sitio.

Para que puedas indicar que la petición es correcta o incorrecta tienes que manipular las siguientes líneas

 $("#txt_val").html("<img src='./imagen_error.jpg'>El numero no existe");

 $("#txt_val").html("<img src='./imagen_ok.jpg'>El numero existe");

Ya entenderás que dentro de la propiedad src va la ubicación y el nombre de tu imagen dependiendo del retorno de la función.

si claro ya para finalizar y de verdad agradecerte demasiado y por tener la paciencia como puedo cambiar el color de la letra de numero no existe y numero existe se podra

Tienes dos posibilidades.

La primera es aplicar un estilo a un span donde encierres el texto el cual asumirá el estilo desde tu css

$("#txt_val").html("<img src='./imagen_error.jpg'><span class='error'>El numero no existe</span>");

La segunda es aplicar el estilo directamente en la etiqueta

$("#txt_val").html("<img src='./imagen_error.jpg'><span style='color:#f00'>El numero no existe</span>");

gracias de verdad me quedo muy bien oye porque cuando lo ejecuto en internet explorer 8 no me sale nada como le puse un fondo negro solo me aparece el fondo y una imagen que puse y el google chrome si me sale

Internet explorer 8 tiene un motor que no es 100% compatible con los estándares web.

Te recomiendo que valides bien tus instrucciones css para que sea compatible con la mayoría de los navegadores.

Recuerda no mezclar los temas en tus preguntas.

Cierra esta pregunta y lo relacionado con diseño verifícalo en las categorías de css o diseño web

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas