10

En mi código tengo dos peticiones ajax anidadas. La idea es que al dar enter sobre el input con id placa se envíe el valor digitado primero a la vista ajax1, haga unas operaciones y luego pase a la vista ajax2 y retorne unos resultados.

Se supondría que al pasar a la segunda petición ajax que se encuentra dentro de la otra, debería imprimirse {'ajax2': true} pero no es así, se esta imprimiendo {'ajax1': true}

¿Qué estoy haciendo mal?

views.py

from django.http import JsonResponse

def ajax1(request):
    if request.method == "POST":
        if request.is_ajax():
            return JsonResponse({"ajax1": True})

def ajax2(request):
    if request.method == "POST":
        if request.is_ajax():
            return JsonResponse({"ajax2": True})

Peticiones ajax

// Función para obtener el token CSRF
function getCookie(name) {
         var cookieValue = null;
         if (document.cookie && document.cookie != '') {
               var cookies = document.cookie.split(';');
         for (var i = 0; i < cookies.length; i++) {
              var cookie = jQuery.trim(cookies[i]);
         if (cookie.substring(0, name.length + 1) == (name + '=')) {
           cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
             break;
            }
         }
     }
return cookieValue;
}

$("#input").keypress(function(e) {

  if(e.which == 13) {
      e.preventDefault();

        var csrftoken = getCookie('csrftoken');

        var placa = $(this).val();

        $.ajax({
              url : window.location.href + "ajax1/",
              type : "POST", 
              data : { csrfmiddlewaretoken : csrftoken,
                       placa : placa,
                    }, 
              success : function(json) {
                  $.ajax({
                    url : window.location.href + "ajax2/",
                    type : "POST",
                    data :  { csrfmiddlewaretoken : csrftoken,
                             placa : placa,
                          },
                    success: function(data2){
                      console.log(data2); // Debería imprimir {ajax2: true}
                    },
                    error : function(xhr,errmsg,err) {
                      console.log(xhr.status + ": " + xhr.responseText);
                    }
                  });
                },

              error : function(xhr,errmsg,err) {
                console.log(xhr.status + ": " + xhr.responseText);
              }
            });
          } 

      }); 
3
  • A mí me funciona el código cuando lo ejecuto en mi máquina (con modificaciones mínimas para que llame a servicios locales)
    – Alvaro Montoro
    el 2 feb. 2016 a las 22:03
  • @JavierCárdenas, en chrome en la sección "Network" el llamado a /ajax2/ que te da como response? el 2 feb. 2016 a las 23:40
  • El error estaba en que una de las url estaba apuntando a la vista incorrecta; sin embargo, me sirvió bastante la respuesta de @fredyfx porque me parece una forma mucho más sencilla y elegante. el 2 feb. 2016 a las 23:51

1 respuesta 1

13

Te recomiendo utilizar las promesas de JavaScript (JavaScript Promises), aqui hay documentación detallada, ya que aseguran que al completar una petición pueda seguir a otra, tal y como lo que estas buscando.

$('#input').keypress(function(e)
  {
        if(e.which == 13) {
  e.preventDefault();

    var csrftoken = getCookie('csrftoken');

    var placa = $(this).val();
    
    var promise = $.ajax({
          url : window.location.href + "ajax1/",
          type : "POST", 
          data : { csrfmiddlewaretoken : csrftoken,
                   placa : placa,
                }, 
          success : function(json) {
              
              //Almacena el resultado en algun lado
  
            },

          error : function(xhr,errmsg,err) {
            console.log(xhr.status + ": " + xhr.responseText);
          }
        });
        promise.then(function(){
            //
                    $.ajax({
                url : window.location.href + "ajax2/",
                type : "POST",
                data :  { csrfmiddlewaretoken : csrftoken,
                         placa : placa,
                      },
                success: function(data2){
                  console.log(data2); // Debería imprimir {ajax2: true}
                },
                error : function(xhr,errmsg,err) {
                  console.log(xhr.status + ": " + xhr.responseText);
                }
              });
        //
        });            
      } 
  });

Espero te sea de utilidad, éxitos en el desarrollo, bendiciones!

Fredy.

2
  • Lo probaré, pero si me interesa entender que estoy haciendo mal en mi código actual. el 20 ene. 2016 a las 1:33
  • 1
    Muchas gracias, me sirvió mucho... el 11 may. 2020 a las 3:48

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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