How to return variable value outside api function call using jquery or javascript

Question

module.exports = function (ctx, application) {
var API;
var usermandData = [];
var clientmandData = [];
var taskmandData = []

API = {

    GetMandatoryFieldsforUser: function () {
        return MandatoryFields.User;
    },

    GetMandatoryFieldsforClient: function () {
        return MandatoryFields.Client;
    },

    GetMandatoryFieldsforTask: function () {
        return MandatoryFields.Task;
    }

};

var UserFields = $.get("api/mapping/mandatoryfield?type=USER", function (d) {        
    this.mandatoryuserdata = JSON.parse(d.Data);
    this.mandatoryuserdata.forEach(function (data) {
        usermandData.push(data.DisplayName);  // returns  ["First Name", "Last Name", "Location", "Email"]
    });      
})

var ClientFields = $.get("api/mapping/mandatoryfield?type=CLIENT", function (d) {
    this.mandatoryClientdata = JSON.parse(d.Data);
    this.mandatoryClientdata.forEach(function (data) {
        clientmandData.push(data.DisplayName); // returns ["Client Type", "Last Name / Entity Name", "Originating Location", "Responsible Person"],
    });
})

var TaskFields = $.get("api/mapping/mandatoryfield?type=TASK", function (d) {
    this.mandatoryTaskdata = JSON.parse(d.Data);
    this.mandatoryTaskdata.forEach(function (data) {
        taskmandData.push(data.DisplayName);  //returns  ["Client Name", "Period End Date", "Task Type", "Responsible Person"]
    });
})


MandatoryFields = {
    User: usermandData,
    Client: clientmandData,
    Task: taskmandData
}

Reqres.setHandler('Dataexportwizard:getMandatoryfields', function (type) {
   // console.log(mandData)
    switch (type) {
        case "USER": return API.GetMandatoryFieldsforUser();
        case "CLIENT": return API.GetMandatoryFieldsforClient();
        case "TASK": return API.GetMandatoryFieldsforTask();
    }
});

My issue here is since it is a async function MandatoryFields.User, MandatoryFields.Client and MandatoryFields.Task returns null value i need to push value of usermandData, clientmandData, taskmandData into MandatoryFields.User , MandatoryFields.Client , MandatoryFields.Task field How to achieve it using jquery or javascript.

since MandatoryFields object executes before jQuery get method I can only use values inside function call but i need to use it inside MandatoryFields object how can i achieve it using jquery

Answer 1

One of the best solution to handle these type of async tasks to use "Promises" (JS feature added by ES6). Try this code may be this will help : -

module.exports = function (ctx, application) {
var API;
var usermandData = [];
var clientmandData = [];
var taskmandData = []

API = {
    GetStepContainerData: function () {
        return StepContainerData;
    },

    GetStepData: function () {
        return stepData;
    },

    GetMandatoryFieldsforUser: function () {
        return MandatoryFields.User;
    },

    GetMandatoryFieldsforClient: function () {
        return MandatoryFields.Client;
    },

    GetMandatoryFieldsforTask: function () {
        return MandatoryFields.Task;
    }

};

Promise.all([
    new Promise(function(resolve,reject){
        $.get("api/mapping/mandatoryfield?type=USER", function (d) {        
            this.mandatoryuserdata = JSON.parse(d.Data);
            this.mandatoryuserdata.forEach(function (data) {
                usermandData.push(data.DisplayName);  // returns  ["First Name", "Last Name", "Location", "Email"]
            });
            resolve();
        });
    }),

    new Promise(function(resolve,reject){
        $.get("api/mapping/mandatoryfield?type=CLIENT", function (d) {
            this.mandatoryClientdata = JSON.parse(d.Data);
            this.mandatoryClientdata.forEach(function (data) {
                clientmandData.push(data.DisplayName); // returns ["Client Type", "Last Name / Entity Name", "Originating Location", "Responsible Person"],
            });
            resolve();
        })
    }),

    new Promise(function(resolve,reject){
        $.get("api/mapping/mandatoryfield?type=TASK", function (d) {
            this.mandatoryTaskdata = JSON.parse(d.Data);
            this.mandatoryTaskdata.forEach(function (data) {
                taskmandData.push(data.DisplayName);  //returns  ["Client Name", "Period End Date", "Task Type", "Responsible Person"]
            });
            resolve();
        });
    })
    ]
).then(function(result){

    // After resolving all the promises this method will execute
    MandatoryFields = {
        User: usermandData,
        Client: clientmandData,
        Task: taskmandData
    }
});


Reqres.setHandler('Dataexportwizard:getMandatoryfields', function (type) {
   // console.log(mandData)
    switch (type) {
        case "USER": return API.GetMandatoryFieldsforUser();
        case "CLIENT": return API.GetMandatoryFieldsforClient();
        case "TASK": return API.GetMandatoryFieldsforTask();
    }
});