Problems with AJAX, JQUERY and JSON

Navigation
0

I am new to AJAX and I have several problems. At this moment, I have a code to send data from a form by JQuery and with these, generate a query on the same page.

This is the HTML code (although I have it as .PHP): 

    <!DOCTYPE html>
<html>
<head>
    <title>Control de Ingresos y Salidas del Centro.</title>
    <meta charset="utf-8">
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximun-scale=1, minimun-scale=1">
    <link rel="stylesheet" type="text/css" href="../estilos/consultaraprendices.css">
    <script type="text/javascript" src="jquery-3.0.0.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            function obtener_datos(){
                $.ajax({                        
                    type:'POST',                 
                    url:"consultaprendiz.php",
                    success: function(data){
                        $('#consulta').html(data);       
                    }
                });
            }
            $(document).on("click", "#enviar", function(){
                var documento=document.getElementById("documento").value;
                alert(doc);
                $.ajax({
                    type:'POST',
                    url:"consultaprendiz.php",
                    data: {documento:"1070627714"},
                    success: function(data){
                        obtener_datos();
                    }
                });
            });
            $(document).on("click", "#enviar", function(){
                var tipodoc=document.getElementById('tipodoc').value;
                alert(tipodoc);
                $.ajax({
                    type:'REQUEST',
                    url:"consultaprendiz.php",
                    data:{tipodoc:"2"},
                    success: function(data){
                        obtener_datos();
                    }
                });
            });
        });
    </script>
</head>
<body>
        <select name="tipodoc" id="tipodoc">
            <option value="0">Tipo de documento</option>
            <option value="1">Tarjeta de identidad</option>
            <option value="2">C&eacute;dula de ciudadan&iacute;a</option>
            <option value="3">C&eacute;dula de extranjer&iacute;a</option>
        </select>
        <input type="number" name="documento" placeholder="N&uacute;mero de documento" id="documento" required>
        <button type="submit" name="enviar" id="enviar">Consultar</button>
    <section id="consulta">
    </section>
</body>
</html>

And this, is the page that should make me the query: 

    <?php
include('conexion.php');
$doc=$_POST['documento'];
$tipodoc=$_REQUEST['tipodoc'];
?>
<?php
        if ($tipodoc==1) { 
            $a = "SELECT * FROM aprendices, fichas, jornadas, ambientes WHERE aprendices.tipo_doc_ap='T.I.' AND aprendices.doc_ap='$doc' AND aprendices.id_ficha=fichas.id_ficha AND fichas.id_jornada=jornadas.id_jornada AND fichas.num_ambiente=ambientes.num_ambiente";
            $b = mysqli_query($mysqli, $a);
            while ($z=mysqli_fetch_array($b)){
                echo "<img src='../imagenes/boton.png' id='foto'>"; echo "<font size='10' class='cajas' id='nombre'>" . $z['nombres_ap']; echo " " . $z['apellidos_ap'] . "</font>"; echo "<font size='10' class='cajas' id='ficha'>" . $z['id_ficha'] . "</font>"; echo "<font size='10' class='cajas' id='programa'>" . $z['nombre_ficha'] . "</font>"; echo "<font size='10' class='cajas' id='jornada'>" . $z['nombre_jornada'] . "</font>"; echo "<font size='10' class='cajas' id='ambientes'>" . $z['num_ambiente']; echo " - " . $z['dependencia_ambiente'] . "</font>"; echo "<font size='10' class='cajas' id='celular'>" . $z['celular_ap'] . "</font>"; echo "<font size='10' class='cajas' id='estadogeneral'>" . $z['estado_ap'] . "</font>"; echo "<font size='10' class='cajas' id='correo'>" . $z['correo_ap'] . "</font>";
            }
        }

I would appreciate the help, because I have tried several things, but I always get the error of undefined indexes.

    
asked by Santiago Correa Aguirre Sanmar 03.11.2018 в 15:53
source

1 answer

0

I've already debugged the code quite a bit. I want to clarify that I have a main page. There I want to do everything without taking me to any other external page. I tried several codes, but the AJAX did not work when a page was called inside the main one. Even so, the AJAX that I need to perform at this moment, is to make a query and show me the same query on the same page.

The example page is called: consultfuncionarios.php 

    <?php
include('conexion.php');
?>
<!DOCTYPE html>
<html>
<head>
    <title>Control de Ingresos y Salidas del Centro.</title>
    <meta charset="utf-8">
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximun-scale=1, minimun-scale=1">
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
           function obtener_datos(){
                $.ajax({                        
                    type:"POST",                 
                    url:"consultarfuncionarios.php",
                    success: function(data){ 
                    }
                });
            };
            $(document).on("click", "#enviar", function(){
                var documento=$("#document").val();
                alert(documento);
                $.ajax({
                    type:"POST",
                    url:"consultarfuncionarios.php",
                    data:{documento:documento},
                    success: function(data){
                        obtener_datos();
                    }
                });
            });
        });
    </script>
</head>
<body>
        <font id="mensaje">N&uacute;mero de documento:&nbsp;</font>
        <input type="number" name="document" placeholder="N&uacute;mero de documento" id="document">
        <button type="submit" id="enviar">Consultar</button>
    <section id="consulta">
        <?php
        if (isset($_POST['document'])) {
            $doc=$_POST['document'];
            $a = "SELECT * FROM funcionarios, ambientes WHERE funcionarios.cc_funcionario='$doc' AND funcionarios.num_ambiente=ambientes.num_ambiente ";
            $b = mysqli_query($mysqli, $a);
            while ($z=mysqli_fetch_array($b)){
                echo "<img src='../imagenes/boton.png' id='foto'>"; 
                echo "<font class='cajas' id='nombre'>" . $z['nombres_f'] . " "; 
                echo $z['apelidos_f'] . "</font>"; 
                echo "<font class='cajas' id='cargo'>" . $z['cargo_funcionario'] . "</font>"; 
                echo "<font class='cajas' id='ambientes'>" . $z['num_ambiente']; 
                echo " - " . $z['dependencia_ambiente'] . "</font>"; 
                echo "<font class='cajas' id='celular'>" . $z['celular_f'] . "</font>"; 
                echo "<font class='cajas' id='estadogeneral'>" . $z['estado_funcionario'] . "</font>"; 
                echo "<font class='cajas' id='correo'>" . $z['correo_f'] . "</font>";
            }
        }
        ?>
        <section id="novedades"></section>
    </section>
</body>
</html>

By the way, when I use only the (without JS code) I get perfect in the section below, but it directs me to another page to show me the query.

Also, the variable itself is defined to me and it seems to be sent, but it does not show me anything.

    
answered by 15.11.2018 в 03:13
problem collapse bootstrap Upload files and data with jquery