Ver Mensaje Individual
  #1 (permalink)  
Antiguo 01/02/2016, 15:54
joroloji
 
Fecha de Ingreso: enero-2016
Mensajes: 8
Antigüedad: 8 años, 3 meses
Puntos: 0
Capturar clic POST con AJAX

Cordial saludo,

Este es el codigo de mi pagina:

Código HTML:
<!DOCTYPE html>
<html>       
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
        <title>Mantenimiento de Alumnos</title>
        <script src="js/jquery-1.12.0.min.js"></script>
        <link type='text/css' rel='stylesheet' href='css/estilo.css'>  
        <script src="js/sweetalert-dev.js"></script>
        <link rel="stylesheet" type="text/css" href="css/sweetalert.css">
        
        <script>
        /* 
         * EVENTO CLIC BOTON BUSCAR ALUMNO, DEVUELVE UNA TABLA
        */
            $(function (){
                $("#btfindAlumno").click(function(){
                   var url = "findAlumno.php";
                   $.ajax({
                       type: 'POST',
                       url: url,
                       data: $("#frmSel").serialize(),
                       success: function (data){
                           $("#tbConsulta").html(data);
                       }
                   });
                   return false;
                });
            });             
            
        </script>            
    </head>
    <body>        
        <div class='divPrincipal'>
            <header class='bodyHeader' style="text-align: center; color: #F2E8DC; font-size: 120%;">
                <label>INSERTAR ALUMNOS</label>
            </header>
            <content class='bodyContent'>
                <div class='divCampos'>
                    <form action='addAlumno.php' method='POST'>
                        <label>CODIGO:</label><input type='text' name='txtCod' maxlength="6" style="width: 100px; text-align: center; font-family: Courier New;"/> <br/>
                        <label>NOMBRE:</label><input type='text' name='txtNom' maxlength="35" style="width: 550px; text-transform: uppercase; font-family: Courier New;"/> <br/>
                        <label>CEDULA:</label><input type='text' name='txtCed' maxlength="11" style="font-family: Courier New;"/>
                        <div style="text-align: center">
                            <input type='submit' value='Insertar' name='btnRegistrar'/>
                        </div>
                    </form>
                </div>
                <h1 class="titulo2"><p1>CONSULTA DE ALUMNOS</p1></h1> 
                <form method="POST" id="frmSel" name="frmSel">                    
                    <div class='divCampos'>
                        <label>CAMPO:</label>
                        <select class="cbfdAlumno" id="cbCampo" name="cbCampo">
                            <option value="ID_ALU">CODIGO</option>
                            <option value="NOMBRE">NOMBRE</option>
                            <option value="IDENTI">CEDULA</option>
                        </select><br/>
                        <label for="txtCampo">DATO:</label>
                        <input type='text' id="txtCampo" name='txtCampo' style="width: 400px; text-transform: uppercase; font-family: Courier New;"/>
                        <input type="submit" id="btfindAlumno" name="btfindAlumno" value ="Buscar">                                                   
                        <div class="tablecontentTable" id="tbConsulta"></div>
                    </div>
                </form>  
                <h1 class="titulo2"><p1>EDICION DE ALUMNOS</p1></h1> 
                <form method="POST" id="frmEdit" name="frmEdit">                    
                    <div class='divCampos'>
                        <label for="txtCampoEdit">CODIGO:</label>
                        <input type='text' id="txtCampoEdit" name='txtCampoEdit' style="width: 100px; text-transform: uppercase; font-family: Courier New;"/>
                        <input type="submit" id="bteditAlumno" name="bteditAlumno" value ="Editar">  
                        <div id="dbCampos"></div>
                    </div>
                </form>  
            </content>
            <footer class='bodyFooter'>
                <p class='pFooter'>DERECHOS RESERVADOS &COPY; 2016</p>
            </footer>
        </div>
    </body>
</html> 
Y este es su aspecto:


Las partes INSERTAR ALUMNO Y CONSULTA DE ALUMNO funcionan bien, CONSULTA ALUMNO me envia a una pagina findAlumno que me lista los datos del alumno cuando doy clic en buscar.

Código HTML:
<!DOCTYPE html>
<html>
    <head>
        <title>BUSCA ALUMNOS</title>            
    </head>
        <?php          
            
            $conexi = mysqli_connect($server, $usuari, $contra, $datbas)            
            or die("Error en la conexion");            
               
            mysqli_set_charset($conexi, "utf8"); /* CAMBIA LOS TIPOS DE CARACTERES*/
            
                $camp = $_POST['cbCampo']; 
                $dato = $_POST['txtCampo']; 
  
                if ($camp=='ID_ALU') 
                { 
                    $browse = "SELECT * FROM `alumno` WHERE `ID_ALU` = '$dato'"; 
                } elseif ($camp=='NOMBRE') { 
                    $browse = "SELECT * FROM `alumno` WHERE `NOMBRE` like '%$dato%' order by `NOMBRE`"; 
                } elseif ($camp=='IDENTI') { 
                    $browse = "SELECT * FROM `alumno` WHERE `IDENTI` = '$dato'"; 
                } 
                
                $result = mysqli_query($conexi,$browse) 
                    or die ("Error en la consulta"); 
                if (mysqli_num_rows($result) == 0)
                {
                    echo '<script type="text/javascript">';
                    echo 'swal({
                            title: "Infomación",
                            text: "No hay datos que coincidan con la busqueda",
                            type: "info",
                            showConfirmButton: true,
                            confirmButtonColor: "#DD6B55",
                            confirmButtonText: "Aceptar",
                            closeOnConfirm: true
                         })';
                    echo '</script>';
                } else {
                
                    echo '<table class="center">                        
                                <tr>
                                    <th style="text-align: center; width: 80px">CODIGO</th>
                                    <th style="text-align: center; width: 400px">NOMBRE</th>
                                    <th style="text-align: center; width: 150px">CEDULA</th>                                    
                                </tr>                       
                      ';

                    while ($row = mysqli_fetch_assoc($result)) {
                        echo '                   
                            <tr>                                
                                <td style="text-align: center; width: 80px;">' . $row["ID_ALU"] . '</td>
                                <td style="text-align: left; width: 400px;">' . $row["NOMBRE"] . '</td>
                                <td style="text-align: center; width: 150px;">' . $row["IDENTI"] . '</td>
                            </tr>
                             
                         '; 
                    }
                } 
            mysqli_close($conexi);            
        ?>
    </body>
</html> 
Lo que deseo es:
Cuando de clic en el boton EDITAR el dato se busque en findAlumno.php y regresar los datos encontrados a un input, pero trato de hacerlo con if (isset($_POST["xxxxxx"])) donde (xxxxxx) capturo si fue el boton BUSCAR o el boton EDITAR quien hizo el POST, pero no he podido implementarlo ya que cuando agrego esta condicion para el boton BUSCAR ya no carga los datos.

Código HTML:
            mysqli_set_charset($conexi, "utf8"); /* CAMBIA LOS TIPOS DE CARACTERES*/
            if (isset($_POST["btfindAlumno"])){
                $camp = $_POST['cbCampo']; 
                $dato = $_POST['txtCampo']; 
                ...........
            }
Gracias de antemano por la ayuda.