Envio formularios JQuery+PHP... problema

augusto_jaramil · #1 (**permalink**) 11/01/2012, 14:26

Companeros.....

Con la novedad de que este par de codigos me canciona como medio regular...

Este es el html (prueba1.html) que hace llamado a un programa php (prueba1.php)

Código HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
	<head>
		<title>Modulo Recursos Humanos</title>
		<meta http-equiv="content-type" content="text/html;charset=utf-8">
		<script type="text/javascript" src="js/jquery.js"></script>
                <script src="js/jquery-validation-1.9.0/jquery.validate.js" type="text/javascript"></script>

<script>
		// initialise plugins
		$(function(){
                $.validator.setDefaults({
	                submitHandler: function() {
                                   $().ajaxStart(function() {
                                            $("#result").hide();
                                   }).ajaxStop(function () {
                                            $("#result").fadeIn("slow");
                                   });

                                   $("#formInfper").submit(function() {
                                            $.ajax({
                                                 type: "POST",
                                                 url: $(this).attr("action"),
                                                 data: $(this).serialize(),
                                                 success: function(data) {
alert(data);
                                                       $("#result").html(data);
                                                 }
                                            });
                                            return false;
                                   });
                        }
                });

                $("#formInfper,#formEstudios").validate({
                     rules: {
                         nombres: "required",
                         apellidos: "required",
                         direccion: "required",
                         },
                     messages: {
                         nombre: "Indique su nombre",
                         apellidos: "Indique su apellido",
                         direccion: "Indique direccion",
                     }
                })

                var fondoOrig = "";
                $(":button").click(function() {
                   posicion = $(this).attr("name");
                })
                $(":button").mouseenter(function() {
                   fondoOrig = $(this).css("background-color");
                   $(this).css("background","blue");
                })
                $(":button").mouseout(function() {
                   $(this).css("background-color", fondoOrig);
                })

                $("#hojavida1,#hvestudios" ).delegate( "*", "focus blur", function( event ) {
                    var elem = $( this );
                    setTimeout(function() {
                       elem.toggleClass( "focused", elem.is( ":focus" ) );
                    });
                });

            })

</script>

    <style type="text/css">
    .boton1 {
        background-color: #6895CC;
        height: 25px;
        font-size: 10pt;
        font-weight: bold;
        color: #FFFFFF;
        border-style: solid;
        border-width: 3;
        -moz-border-radius:7px;
    }
    .boton0 {
        background-color: #CFDEFF;
        height: 25px;
        font-size: 10pt;
        font-weight: bold;
        color: #FFFFFF;
        border-style: solid;
        border-width: 3;
        -moz-border-radius:7px;
    }

    .focused {
       background-color: blue;
    }

/**********************************

Use: Main Screen Import

***********************************/

@import "reset.css";
@import "core.css";

@import "cmxformTemplate.css";
@import "cmxform.css";
    </style>
</head>
<body>
	<form id="formInfper" name="formInfper" method="post" action="prueba1.php">
		<div id="opciones" style="display:block">
		<table align="left" width="90%" border="0">
		<td align="left">
                   <input type="submit" value="Informacion Personal" name="infper" id="infper" onkeypress="return handleEnter(this, event)" class="boton0">
                   <input type="submit" value="Educacion Formal" name="edufor" id="edufor" onkeypress="return handleEnter(this, event)" class="boton1">
                   <input type="submit" value="Idiomas y Edicacion No Formal" name="edunofor" id="edunofor" onkeypress="return handleEnter(this, event)" class="boton1">
                   <input type="submit" value="Experiencia Laboral" name="experiencia" id="experiencia" onkeypress="return handleEnter(this, event)" class="boton1">
                   <input type="submit" value="Referencias Laborales" name="reflaborales" id="reflaborales" onkeypress="return handleEnter(this, event)" class="boton1">
                   <input type="submit" value="Referencias Personales" name="refper" id="refper" onkeypress="return handleEnter(this, event)" class="boton1">
               </td>
               </table>
               </div>
<br></br>
                <div id="hojavida1" style="width:1410px; height:500px; -moz-border-radius:20px; background-color:#6895CC;display:block">
<br>
		  <table border="0">
			<tr>
				<td>Nombre: <input type="text" class="required" id="nombre" name="nombre"></td>
			</tr>
			<tr>
				<td>Apellidos: <input type="text" class="required" id="apellidos" name="apellidos"></td>
			</tr>
			<tr>
				<td>Direccion: <input type="text" class="required" id="direccion" name="direccion"></td>
			</tr>
		</table>
		</div>
	</form>
</body>
<html>

Este es el codigo php (prueba1.php)

Código PHP:

  <?
echo "Datos recibidos Ok";
print_r($_POST);
?>

La vaina es la siguiente:

1. Para que haga el primer llamado a prueba1.php debo hacer doble click en el boton "Educacion Formal"
2. Si hago nuevamente click en ese boton recibo 2 veces la respuesta de prueba1.php (servidor).
3. Si hago nuevamente click en cualquier boton (ya van 4 clicks) recibo 3 veces la respuesta de prueba1.php y si de nuevo hago click obtengo 4 respuestas....

Como le hago para que, asi le haga metecientos mil clicks, recibir solo una respuesta?

Me imagino que ha de faltarme algo.... pero uno como primiparo en el tema no se que sera....

Gracias de antemano por su ayuda

Un Cordial Saludo

Sergio_Reynaga · #2 (**permalink**) 11/01/2012, 14:52

Hola que tal, cual es tu problema en si?

Esque baje tu codigo lo puse en mi IDE, y lo ejecute para ver que problema tiene, pero todo funciono a la perfeccion, agrego informacion en los campos nombre apellido y direccion y al dar clic en cualquier boton me imprime el post, despues doy clic en atras para regresar a prueba1.html e ingresar datos distintos y de nuevo doy clic en cualquier boton e imprime el post solo 1 vez no me imprime varios.

Entonces cual es el problema que estas teniendo?

augusto_jaramil · #3 (**permalink**) 11/01/2012, 15:12

Gracias por responder Sergio_Reynaga

El lio que tengo es que para que me ejecute la primera vez hago doble click en el boton Educacion Formal y me sale la alerta (el alert(data) que esta debajo de la linea success: function(data) {) una sola vez.

Si hago nuevamente click en el boton sale 2 veces la alerta y nuevamente click sale 3 veces la alerta.... lo que me hace soponer es que hace el llamado a php tantas veces como click haya hecho sobre el boton.... me entendes?

Un Cordial Saludo

augusto_jaramil · #4 (**permalink**) 11/01/2012, 21:20

Nooooo.... que va ome.......

Hice una modificacion en el codigo php para comprobar que esta sucediendo lo que yo pensaba.... que hace el llamado al codigo php con un solo click las veces que he hecho click en lo botones...

Código PHP:

  <? 
session_start(); 
 
include_once("lee_base.php"); 
include_once("configuracion/abrirbd.php"); 
 
$nombre = $_POST["nombre"]; 
$apellido = $_POST["apellidos"]; 
$direccion = $_POST["direccion"]; 
 
$sql = "SELECT * FROM prueba1 WHERE nombre='$nombre'"; 
$res = lee_todo($sql); 
if (count($res) == 0) { 
   $sql = "INSERT INTO prueba1 VALUES ('$nombre','$apellido','$direccion','1')"; 
} 
else { 
   $x= $res[0]['conse']+1; 
   $sql = "UPDATE prueba1 SET apellido='$apellido', direccion='$direccion', conse='$x' WHERE nombre='$nombre'"; 
} 
ejecuta_query($sql); 
echo "Datos recibidos Ok\n$sql"; 
?>

La idea con esto es que voy actualizando un campo en la tabla cada vez que entre a ejecutar el codigo anterior.

El resultado:
1. Al hacer dos ckick deja el campo en 1 ya que ejecuta el INSERT a la tabla.... (La primera vez tengo que hacer 2 clicks para que ejecute el php) ahi vamos bien.

2. Al hacer el tercer click el campo lo deja en 3 (Hace UPDATE a la tabla).Segun mis cuentas hasta el momento he hecho 3 clicks sobre el boton (2 clicks para hacer el primer llamado a php y 1 mas en este paso). Si funcionara bien la vaina el campo en la tabla deberia quedar en 2, ya que han sido dos veces que he ejecutado el script

3. Nuevamente hago click en el boton (ya van 4 clicks). El campo lo deja en 6!!!!! oh my god!!!!! SACA LA PIEDRA.....

Menos mal no estoy actualizando un reporte de ventas para la gerencia

QUE VAINA TENGO MAL!!!!! o QUE VAINA ME FALTA!!!!!

AUXILIOOOO!!!!!