0

Necesito almacenar la respuesta de una petición GET con dos parámetros en JavaScript. Tengo el siguiente código y no obtengo la respuesta adecuada.

Aquí relleno el campo select del formulario con todos los destinos que tengo en mi base de datos:

function Solicita_Datos () {    
    var url = "http://localhost:8000/api/v1/destination";
    peticion.onreadystatechange = tratarDestinoForm;
    peticion.open("GET", url, true);
    peticion.send();    
}

function tratarDestinoForm () {
    //Se encarga de tratar las respuestas que vienen del servidor
    var respuestaForm;
    if (peticion.readyState == 4) {
        if (peticion.status == 200) {
            respuesta = JSON.parse(peticion.responseText);
            RellenaSelect(respuesta);
        } else
            alert("Ocurrio un problema con la URL.");
    }
}


function RellenaSelect (los_datos) {
    var otro_select = document.getElementById('destinoForm');
    for (i = 0; i < los_datos.length; i++) {
        var opt = document.createElement('option');
        opt.value = los_datos[i].provincia;
        opt.innerHTML = los_datos[i].provincia;
        otro_select.appendChild(opt);
    }
}

En esta función guardo los valores del destino y del peso introducidos en un formulario:

function calcular () {
    var peso = document.getElementById('peso').value;
    var destino = document.getElementById('destinoForm').selectedIndex;
    var destino = destino + 1;
    obtenerTransporte(destino, peso);
}

En esta función hago la petición AJAX:

function obtenerTransporte (destino, peso) {
    var url = "http://localhost:8000/api/v1/providerD/" + destino + "/" + peso;
    peticion.onreadystatechange = respuestaTransporte();
    peticion.open("GET", url, true);
    peticion.send(destino, peso);
}

function respuestaTransporte() {
    var respuesta;
    texto = "<tr></th><th>Nombre</th><th>Importe</th><th>Entrega</th><th>Peso</th></tr>";
    if (peticion.readyState == 4)

        if (peticion.status == 200) {

            respuesta = peticion.responseText;
            var cadena = respuesta.split("<");
            var respuestaV = cadena[0];
            var dato = JSON.parse(respuestaV);

            for (var i = 0; i < dato.length; i++) {    
                texto += "<tr><td>" + dato[i].nombre + "</td><td>" + dato[i].importe + "</td><td>" +
                dato[i].entrega + "</td><td>" + dato[i].peso + "</td><td>" + "</td>";    
            } 

            document.getElementById('tabla').innerHTML = texto;
        }
    else alert("Ocurrio un problema con la URL");
}

El problema que tengo es que según como está codificado, la petición que estoy guardando en la variable dato es la petición que devuelve todos los destinos, no la que tiene dos parámetros. ¿Por qué puede estar pasando esto? ¿Alguna solución?

6
  • 1
    1. No definas peticion como global, si no como variable local. Cada función que hace una llamada al API debe tener su propio objeto XMLHttpRequest. 2. Estás ejecutando la función obtenerTransporte en lugar de asignarla al onreadystatechange.
    – gugadev
    Commented el 7 may. 2018 a las 14:47
  • @gugadev perdona pero no entiendo muy bien lo que dices, ya que he declarado una variable peticion dentro de la función obtener transporte y tampoco funciona. Podrías poner el código al que te refieres? Tampoco entiendo lo de que no estoy asignando obtener transporte al onreadystatechange, ¿cómo podría hacer eso?
    – Lara
    Commented el 7 may. 2018 a las 20:30
  • @gugadev puedes explicar con mas detalle lo que comentabas?
    – Lara
    Commented el 9 may. 2018 a las 14:17
  • @Lara, estas usando la variable petición en Solicita_Datos y en obtenerTransporte., esta variable debería ser una por cada petición, no una común para las dos peticiones Ajax. Por otro lado, en esta línea peticion.onreadystatechange = respuestaTransporte(); estás ejecutando la función respuestaTransporte y el resultado de la misma lo estás asignando al onreadystatechange, fíjate como lo tienes echo en Solicita_Datos y haz lo mismo. Esto es lo que te han querido decir anteriomente.
    – ElChiniNet
    Commented el 11 may. 2018 a las 17:30
  • Conseguí solucionarlo! Gracias, efectivamente es por lo que decíais.
    – Lara
    Commented el 12 may. 2018 a las 17:48

0

Tu Respuesta

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

Examina otras preguntas con la etiqueta o formula tu propia pregunta.