Foros del Web » Programando para Internet » Javascript »

[SOLUCIONADO] Llamar datos de consulta en div con JS

Estas en el tema de Llamar datos de consulta en div con JS en el foro de Javascript en Foros del Web. Hola amigos, Les cuento lo siguiente tengo un formulario donde el primer campo se llama NIT, cuando el usuario digita el numero, mediante JS se ...
  #1 (permalink)  
Antiguo 28/03/2020, 16:57
 
Fecha de Ingreso: abril-2011
Ubicación: Colombia
Mensajes: 64
Antigüedad: 9 años, 1 mes
Puntos: 4
Llamar datos de consulta en div con JS

Hola amigos,

Les cuento lo siguiente tengo un formulario donde el primer campo se llama NIT, cuando el usuario digita el numero, mediante JS se hace una consulta mysql y si encuentra el registro regresa los resultados y automaticamente rellena los otros dos imputs nombre y direccion.

El codigo que tengo funciona bien, solo que en ves de traerme el dato de nombre al imput nombre, me arrastra al input tanto el nombre como la direccion y asi pasa tambien en el imput de direccion, arrastra el dato del nombre y direccion, como no se ada de JS acudo a ustedes para que me ayuden por favor a verificar donde tengo el error.

dejo los codigos para ver si me pueden ayudar, de antemano gracias.

formulario.html
Código:
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Ajax POST</title>
 
</head>
<body>
    <form id="myForm">
        <label>RUT:</label>
        <div><input type="text" id="nit" name="n_nit"></div>
        <br>
        <label>NOMBRE:</label>
        <div><input type="text" id="nombre" name="nombre"></div>
		<br>
        <label>direccion:</label>
        <div><input type="text" id="dir" name="dir"></div>
		
    </form>
 
    <script>
    document.getElementById("nit").onchange = function(){alerta()};
    function alerta() {
        // Creando el objeto para hacer el request
        var request = new XMLHttpRequest();
		 
        // Objeto PHP que consultaremos
        request.open("POST", "services.php");
 
        // Definiendo el listener
        request.onreadystatechange = function() {
            // Revision si fue completada la peticion y si fue exitosa
            if(this.readyState === 4 && this.status === 200) {
                // Ingresando la respuesta obtenida del PHP
                document.getElementById("nombre").value = this.responseText;
				document.getElementById("dir").value = this.responseText;
            }
        };
 
        // Recogiendo la data del HTML
        var myForm = document.getElementById("myForm");
        var formData = new FormData(myForm);
 
        // Enviando la data al PHP
        request.send(formData);
    }
</script>
</body>
</html>
Y este es el services.php

Código PHP:
<?php
if($_SERVER["REQUEST_METHOD"] == "POST") {
    
$NIT htmlspecialchars(trim($_POST["n_nit"]));
 
    
// Codigo para buscar en tu base de datos acá
 
 
    
require 'conexion.php';
 
    
$sqlsi "SELECT * FROM gcs WHERE n_nit = '$NIT'";
    
$resultado $mysqli->query($sqlsi);
    
$dato $resultado->fetch_assoc();
 
 
    
$nombre $dato['n_est'];
    echo 
$nombre;
    
$dir $dato['d_est'];
    echo 
$dir;
 
 
} else {
    echo 
"<p>No se encontro el nombre en la DB!!</p>";
}
?>
  #2 (permalink)  
Antiguo 28/03/2020, 17:52
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 6.690
Antigüedad: 12 años, 3 meses
Puntos: 1117
Respuesta: Llamar datos de consulta en div con JS

Cita:
como no se ada de JS acudo a ustedes para que me ayuden
Antes de ayudarte te invito a 2 cosas

1.- lee y estudia javascript, no puedes pretender hacer un trabajo para el cual no estas calificado, nosotros también tuvimos que hacerlo incluso tras años aun seguimos diariamente documentandonos.

2.- lee tu propio código, no necesitas saber ni una pizca de javascript para saber cual es el problema, nótese que saber donde esta el problema no es lo mismo que saber resolverlo, para eso tendrás que investigar.

..................................

Cuando tengas algo mas regresa, plantea mejor tu duda y muestra que has intentado algo, con tu explicación actual me dice que no sabes que es lo que estas haciendo, muchas veces vienen usuarios preguntando y cuando se les da una respuesta no la comprenden por carecer de ese mínimo de conocimiento sobre el tema y/o pereza en investigar.


Pista: respuesta PHP
  #3 (permalink)  
Antiguo 29/03/2020, 10:02
 
Fecha de Ingreso: abril-2011
Ubicación: Colombia
Mensajes: 64
Antigüedad: 9 años, 1 mes
Puntos: 4
Exclamación Respuesta: Llamar datos de consulta en div con JS

Cita:
Iniciado por ArturoGallegos Ver Mensaje
Antes de ayudarte te invito a 2 cosas

1.- lee y estudia javascript, no puedes pretender hacer un trabajo para el cual no estas calificado, nosotros también tuvimos que hacerlo incluso tras años aun seguimos diariamente documentandonos.

2.- lee tu propio código, no necesitas saber ni una pizca de javascript para saber cual es el problema, nótese que saber donde esta el problema no es lo mismo que saber resolverlo, para eso tendrás que investigar.

..................................

Cuando tengas algo mas regresa, plantea mejor tu duda y muestra que has intentado algo, con tu explicación actual me dice que no sabes que es lo que estas haciendo, muchas veces vienen usuarios preguntando y cuando se les da una respuesta no la comprenden por carecer de ese mínimo de conocimiento sobre el tema y/o pereza en investigar.


Pista: respuesta PHP
Hola, gracias por la leccion

La verdad este proyecto es para algo netamente personal, por lo que veo innecesario aprender JS, soy abogado de profesion y se una que otra cosa de programacion.

atendiedo tu recomendacion, llegue aqui porque ya llevo varios dias leyendo e investigando porque los datos me llegan a los dos inputs, por lo q puedo entender alguna funcion en JS esta llamando todo el contenido completo del php, pero lo que no se es como puedo hacer que me llame esa info del php pero por separado, por eso es que considero que la informacion esta mal llamada con la funcion del JS.

en el php intente poner las variables en Divs algo asi:

Código PHP:
<html>
<body>
<div id="nombre"><? echo $nombre;?></div>
<div id="dir"><? echo $dir;?></div>
</body>
</html>
Lo anterior lo hice porque segun entendi la funcion del javascript llama los datos de acuerdo al identificador del id (Creo q es asi) document.getElementById("myDiv")...

Entonces lo anterior tampoco funciono, ya que a los inputs sigue arrastrando toda la info incluyendo todo el codigo html.

Entonces sigo como al inicio, segun tu pista mi error puede estar en el php, pero por mas que le he probado no hay forma que me llame los datos por separado al respectivo input, por eso acudo nuevamente al foro para ver si es posible una luz, gracias.
  #4 (permalink)  
Antiguo 29/03/2020, 13:06
 
Fecha de Ingreso: abril-2011
Ubicación: Colombia
Mensajes: 64
Antigüedad: 9 años, 1 mes
Puntos: 4
Respuesta: Llamar datos de consulta en div con JS

Holas amigos ...

Listo el pollo, solucionado el tema...

Mi problema no era tan grave y lo entendi porque alguien mas me lo explico y pues lo comparto con uds porque para eso es el conocimiento, para compartirlo y no para negarlo a los demas..

Mi codigo tenia los siguientes errores, en el JS, estaba request que no se usa para este tipo de peticiones, lo correcto era usar
Código HTML:
request.responseType = 'json';
,
luego al recoger los datos de los inputs debia hacerse con el metodo response en ves de responseText de esta manera
Código HTML:
document.getElementById("dir").value = this.response.dir;
al final de la linea solo debia agregarle el valor que debia estar ya dispuesto desde el services.php en formato json, para eso fue necesario hacer un array de las variables que queria llamar quedando de esta forma:
Código PHP:
$nombre $dato['n_est'];
$dir $dato['d_est'];

echo 
json_encode([
   
'nombre' => $nombre,
   
'dir'    => $dir
]); 
.

Con esos arreglos fue suficiente para que mi pequeño script funcionara sin problema algun, agradezco a los amigos de stack overflow que compartieron su conocimiento conmigo y permitieron ayudarme a ver la luz.

Si es que no lo borran, dejo el proyecto en este link, para que puedan verlo en funcionamiento.



La zona horaria es GMT -6. Ahora son las 12:10.