0

espero puedan ayudarme

Estoy empezando con ajax y necesito poder realizar lo siguiente:

Tengo unos inputs dentro de un formulario, 3 de ellos tienen que completarse bajo una consulta externa.

Para completarse necesitan tener una variable primero, esta la tengo que escribir en uno de los inputs ("DAT").

Ahora quiero que esto se logre sin recargar la página.

He logrado con el código siguiente que la secuencia se formule, es decir escribo lo que necesito en el input, lo envió y si en el archivo "ejemplo.php" escribo esas variables con un echo, se imprimen.

Ahora necesito que estas variables se impriman dentro de los inputs anteriores

¿Como lo lograría?

<script>
$(document).on('ready',function(){

  $('#btn-ingresar').click(function(){
    var url = "ejemplo.php";                                      

    $.ajax({                        
       type: "POST",                 
       url: url,                    
       data: $("#dat").serialize(),
                {
               $('#resp').html(data);       
       }
     });
  });


});
</script>

2 respuestas 2

2

En el archivo ejemplo.php puedes descomponer los datos serializados y hacer echo o return

json_encode($datos=array("dato1"=>$_POST["inputx"], "dato2"=>$_POST["inputy"]));

Tambien debes agregar dataType: 'JSON' y success en la function ajax, de la siguiente forma.

$.ajax({
    url: url,
    type:'POST',
    dataType: 'JSON',
    data:{misdatos.serializados},
    success:function(resp){
        $("#myinput1").val(resp.dato1); 
        $("#myinput2").val(resp.dato2);
    }
});
1

Te faltaría utilizar la función success(), te dejo una breve explicación.

El método $.ajax() cuenta con dos sintaxis posibles:

$.ajax(url, { objeto-configurable } );

// o

$.ajax( { objeto-configurable } );

En la primera sintaxis, se especifica la url a la que enviar la petición Ajax, y luego se pasa el objeto configurable, y en la segunda, se pasa directamente el objeto, que también contendrá la dirección url de la petición.

El objeto configurable contendrá uno o varios de los parámetros siguientes:

type : tipo de la petición, GET o POST (GET por defecto).

url : dirección a la que se envía la petición.

data : datos a enviar al servidor.

dataType : tipo de datos que esperas obtener del servidor (si no se especifica, jQuery intenta averiguar de qué tipo se trata).

success : función que se ejecuta cuando se obtiene una respuesta con éxito.

error : función que se llama si la petición no tiene éxito.

$.ajax({
    url: 'https://reqres.in/api/users'
});

Se pasa un objeto configurable muy básico, con sólo una propiedad, la url a la que enviar la petición. SIn embargo, faltaría añadir al menos, la forma en la que gestionar la información que retorna del servidor. Podemos hacer esto, añadiendo la propiedad success , un método que se ejecuta cuando se obtiene una respuesta con éxito del servidor.

En el siguiente ejemplo, enviamos una petición get al servidor, y si obtenemos una respuesta con éxito, la mostramos por la consola del navegador. Si hubiera un error en la petición y no se consiguiese obtener la información del servidor, se ejecutaría la función error , añadida en el objeto configurable.

$.ajax({
        url: 'https://reqres.in/api/users',
        success: function(respuesta) {
            console.log(respuesta);
        },
        error: function() {
            console.log("No se ha podido obtener la información");
        }
    });

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.