Returning String Result from Ajax Method
Solution 1
Why your code is like this?
success: function (data, textStatus, jqXHR) {
// return data;
},
Did you use it?
success: function (data, textStatus, jqXHR) {
console.log(data);
}
Ok, i got it. When you use an ajax request your will work with asynchronous data, to do this you need return a promise in your method. Please, try to use the code below.
getcolors: function getcolors(name) {
return $.ajax({
url: "/api/ideas/getcolors",
data: { name: name },
type: "GET",
contentType: "application/json; charset=utf-8",
dataType: "json",
});
}
And for use your function use this code:
getcolors("name").done(function(result){
console.log(result);
});
Or you can use a callback
getcolors: function getcolors(name, success, error) {
return $.ajax({
url: "/api/ideas/getcolors",
data: { name: name },
type: "GET",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data){
success(data);
},
error: function(data){
error(data);
}
});
}
... And for use with callbacks:
getcolors("name", function(data){
//success function
console.log(data);
}, function(){
//Error function
console.log(data);
})
Try one of this options and tell the result.
Solution 2
The Solution
First of all I would like to thank Mateus Koppe for his efforts, through his solution I got the way to solve my problem .. What I did simply is just I received the ResponseText from the incoming successful result in my Ajax method and then I passed it to a callback function that handles the result like the following :
getcolors: function getcolors(name, handleData) {
$.ajax({
url: "/api/ideas/getcolors",
data: { name: name },
type: "GET",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
handleData(data.responseText);
//return data.responseText;
},
error: function (data) {
handleData(data.responseText);
//return data.responseText;
},
async: false
});
then I worked with getColorArrayModified to loop through my categories list and populate its own color.
getColorArrayModified: function getColorArrayModified(categories) {
var colors = [];
for (var i = 0; i < categories.length; i++) {
this.getcolors(categories[i], function (output) {
colors.push(output);
});
}
return colors;
}
Thanks for all :).
Ahmed Elbatt
Updated on March 10, 2020Comments
-
Ahmed Elbatt about 4 years
I have a DoughnutChart chart and I would like to change the color of its parts regarding color hexa-codes saved in the database I used this Ajax method to get the color string by invoking an action method that returns JSON Result ,
getcolors: function getcolors(name) { return $.ajax({ url: "/api/ideas/getcolors", data: { name: name }, type: "GET", contentType: "application/json; charset=utf-8", dataType: "json", success: function (data, textStatus, jqXHR) { // return data; }, error: function (data) { // return "Failed"; }, async: true });
but instead of receiving the string I received Object {readyState: 1} in the console window
However, I can find the color value stored in ResponseText element.I need your help in how can I get the color value as string.
EDIT :
To make things more clear that's where I would like to invoke the ajax method to receive the color string then I will be able to push in the chart color array .
getColorArray: function getColorArray(categories) { var colors = []; for (var i = 0; i < categories.length; i++) { console.log(this.getcolors("Risk")); //colors.push(this.getcolors(categories[i])); } return colors; }
-
Ahmed Elbatt about 7 yearsYes I did and I exactly got the color hex code .. but I need to pass this value to another JS method for coloring the chart parts !
-
Ahmed Elbatt about 7 yearsFor the first solution I tried to do what you wrote but I didn't receive any results and for the second one I received Uncaught ReferenceError: data is not defined in the console window.
-
Ahmed Elbatt about 7 yearsThank you Mateus , your solution helps me too much through my way to find the solution :).
-
Mateus Koppe about 7 yearsCan you give a check in my answer? ;)