2011-02-14 19 views
5

Estoy escribiendo una función genérica que se reutilizará en varios lugares en mi script.Funciones de devolución de llamada de javascript con ajax

La función usa ajax (usando la biblioteca jQuery) así que quiero pasar de alguna manera una función (o líneas de código) a esta función para ejecutarla cuando ajax se completa. Creo que esto debe ser una función de devolución de llamada, pero después de leer algunas respuestas de devolución de llamada todavía estoy un poco confundido acerca de cómo implementaría en mi caso.

Mi función actual es:

function getNewENumber(parentENumber){ 

     $.ajax({ 
       type: "POST", 
       url: "get_new_e_number.php", 
       data: {project_number: projectNumber, parent_number: parentENumber}, 
       success: function(returnValue){ 
        console.log(returnValue); 
        return returnValue; //with return value excecute code 

       }, 
       error: function(request,error) { 
        alert('An error occurred attempting to get new e-number'); 
        // console.log(request, error); 
       } 
     }); 
    } 

Con esta función Quiero ser capaz de hacer algo de la misma manera otras funciones jQuery es decir trabajan;

var parentENumber = E1-3; 

getNewENumber(parentENumber, function(){ 
    alert(//the number that is returned by getNewENumber); 
}); 
+0

supongo, esto no es posible (o al menos, muy difícil) de esta manera . Deberías intercambiar funciones. – kirilloid

Respuesta

7

Sólo dar getNewENumber otro parámetro para la función, a continuación, usar eso como la devolución de llamada.

// receive a function -----------------v 
function getNewENumber(parentENumber, cb_func){ 

    $.ajax({ 
      type: "POST", 
      url: "get_new_e_number.php", 
      data: {project_number: projectNumber, parent_number: parentENumber}, 

      // ------v-------use it as the callback function 
      success: cb_func, 
      error: function(request,error) { 
       alert('An error occurred attempting to get new e-number'); 
       // console.log(request, error); 
      } 
    }); 
} 

var parentENumber = E1-3; 

getNewENumber(parentENumber, function(returnValue){ 
    alert(returnValue); 
}); 
+0

Perfecto. Yo nuevo sería algo simple. Siempre es más fácil aprender cuando se coloca en su propio contexto. Gracias –

+0

@ Zak: De nada. – user113716

+0

Gracias por el claro y explícito ejemplo. – guptron

2

@patrick dw's anwser es correcta. Pero si quiere seguir llamando a los console.log (o cualquier otra acción) siempre, no importa lo que hace la función de código de llamadas, a continuación, puede añadir la devolución de llamada (el nuevo parámetro) dentro de la función del éxito que ya tiene:

function getNewENumber(parentENumber, cb_func /* <--new param is here*/){ 

    $.ajax({ 
      type: "POST", 
      url: "get_new_e_number.php", 
      data: {project_number: projectNumber, parent_number: parentENumber}, 
      success: function(returnValue){ 
       console.log(returnValue); 
       cb_func(returnValue); // cb_func is called when returnValue is ready. 
      }, 
      error: function(request,error) { 
       alert('An error occurred attempting to get new e-number'); 
       // console.log(request, error); 
      } 
    }); 
} 

Y el código de llamada sigue siendo el mismo que el suyo excepto que la función recibirá el returnValue por el parámetro:

var parentENumber = E1-3; 

getNewENumber(parentENumber, function(val /* <--new param is here*/){ 
    alert(val); 
}); 
+0

Sí, cuando lo estaba implementando en mi código, me preguntaba cómo hacerlo si hubiera querido tener otras acciones exitosas. Gracias –

0

Esto se hace mejor con jQuery de Deferred Objects. Haga que su llamada AJAX devuelva el objeto jqXHR.

function getNewENumber(parentENumber) { 
    return $.ajax({ ... }); 
} 

getNewENumber(E1 - 3).then(success_callback, error_callback); 

Si desea mantener la devolución de llamada de error dentro que funcione puede registrar que hay en su lugar:

function getNewENumber(parentENumber) { 
    var jqXHR = $.ajax({ ... }); 
    jqXHR.fail(...); 
    return jqXHR; 
} 

getNewENumber(E1 - 3).done(success_callback); 
Cuestiones relacionadas