Peticiones ajax utilizando callbacks

Question

Estoy desarrollando una aplicación web, básicamente lo que debo hacer es crear componentes de un formulario en base a la información que recojo de una base de datos.

var _populate = function (idparametro) {
    jQuery.ajax({
        type: "GET",
        async: false,
        url: pathservicehost + '/dominios/' + idparametro,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data, status, jqXHR) {
            console.log('Dominios Ok...');
            return data;
        },
        error: function (jqXHR, status) {
            alert('Error (Obtener Dominios)');
        }
    });
};

var _draw = function (callback) {
    idparametro = 100;
    data = callback(idparametro);
    defecto = -1;
    for (var i = 0; i < data.length; i++)
        if (data[i].Defecto == 1) defecto = i;

    $('#cbxparam').kendoComboBox({
        animation: false,
        dataTextField: "Descripcion",
        dataValueField: "Descripcion",
        dataSource: data,
        filter: "contains",
        suggest: true,
        index: defecto
    });
};

La función _populate lo que hace es traer la data con la que por ejemplo un combobox es poblado o los valores que un grupo de radiobuttons deben tener y la función _draw es la encargada de dibujar al widget (con la data que le corresponde). El problema que tengo es que necesito encontrar la manera en que la función _draw espere a que _populate termine de consumir el servicio y la data sea devuelta antes de seguir ejecutando las siguientes líneas de código (bucle for).

Espero alguién pueda aconsejarme saludos.

Al usar `async: false` en tu llamada AJAX le estás quitando la A a AJAX, en pocas palabras estás usando SJAX (Síncrono). Lo ideal sería que uses Promesas, por ejemplo. — César, Apr 07 '16 at 17:16

score 2 · Answer 1 · edited Apr 13 '17 at 13:00

Lo que pasa es que tienes un error de la forma como ejecutas tu código. Ya que como AJAX es Asíncrono, cuando ejecutas tu _draw(), tu petición no ha vuelto del servidor, por eso no se llena.

lo que considero que debes hacer es invocar dentro de tu _populate(), específicamente en el success, la función _draw() algo así:

var _execute = function (callback) {
    idparametro = 100;
    callback(idparametro);
};

var _draw = function (callback) {
    defecto = -1;
    for (var i = 0; i < data.length; i++)
        if (data[i].Defecto == 1) defecto = i;

    $('#cbxparam').kendoComboBox({
        animation: false,
        dataTextField: "Descripcion",
        dataValueField: "Descripcion",
        dataSource: data,
        filter: "contains",
        suggest: true,
        index: defecto
    });
};

var _populate = function (idparametro) {
    jQuery.ajax({
        type: "GET",
        async: false,
        url: pathservicehost + '/dominios/' + idparametro,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data, status, jqXHR) {
            console.log('Dominios Ok...');
            _draw(data);
        },
        error: function (jqXHR, status) {
            alert('Error (Obtener Dominios)');
        }
    });
};

_execute(_populate); //Ejecuto todo el código.

Lo que hice fue, que la función _execute(); invocara la función _populate(); luego cuando esta función llegue al .success() invocara el _draw(); Con esto se invocara todo en un orden lógico.

Te dejo este link de una pregunta similar que consteste.

gracias por tu respuesta ... el problema es que la función _draw no solamente dibuja un combobox, sino que también otros widgets textbox, textarea, etc. (ojo que estos no necesitan ser poblados con data adicional), en pocas palabras la función _populate solo será invocada en ciertas ocasiones. Saludos. — alexander zevallos, Apr 07 '16 at 17:43
@alexanderzevallos Bueno porque no haces algo, divides en 2 funciones (Creo que es lo mas lógico) los que se llenan con Data y los que no. y dependiendo de tu caso invocas una o la otra. — Wilfredo, Apr 07 '16 at 17:44

Peticiones ajax utilizando callbacks

1 Answers1