Reputation: 7
I am trying to create a Javascript promise for a ajax call. If it returns the right response, I am resolving it and had attached the corresponsing then block to the Promise. If it rejects, I have a catch block for that. Unfortunately, for me, eventhough i reject, the then block in the promise gets executed. Please help me address this. Below is the code block I am using in my app.
function check (){
return new Promise ((resolve, reject) => {
$.ajax({
type:"get",
url : "API",
data:{"jsonData":"validJsonData"},
async:true,
success:function(responseMap){
if(responseMap.data && JSON.parse(responseMap.data)) {
resolve(responseMap)
}else{
reject(responseMap.message)
}
},error : function(errorObj){
reject(errorObj)
}
}).then(result => {
let obj= JSON.parse(result.data);
// process obj
loader.hide();
}).catch(error => {
console.log(error)
// error handle logic
loader.hide();
});
});
}
Upvotes: 0
Views: 792
Reputation: 171679
You are using the explicit promise construction antipattern since $.ajax already returns a Promise.
Also the success
callback of $.ajax is not part of it's promise chain so use then()
instead
Your code should look more like:
function check() {
// return the $.ajax promise
return $.getJSON(url, { "jsonData": "validJsonData" }).then(function(responseMap) {
// not sure why you had extra JSON.parse() in here
if (responseMap.data) {
return responseMap.data
} else {
return Promise.reject(responseMap.message)
}
}).then(function(result) {
loader.hide();
// return to next then()
return result
}).catch(error => {
console.log(error)
// error handle logic
loader.hide();
});
}
// usage
check().then(data=>console.log(data))
Upvotes: 1