Loading asp:chart from javascript

Question

The following logic runs onload of the web page and calls a partial view to display data in the chart:

<img src='@Url.Action("_GetChartDetails", "Chart", new { chartType = "Won" })' id="chartid" />

this works.

but when I do it from javascript the image is blank. Could anyone advice what I could be doing wrong?

$http.get("http://localhost:51666/Chart/_GetChartDetails?chartType=Loss")
.success(function (response) {

    alert(response);

    //$("#chartid").attr("src", "data:image/png;base64," + response);

    document.getElementById("chartid").src = response;

}).error(function (data, status, headers, config) {

    alert(data);

});

Nope, but this doesn't make sense cause the MVC controller gets called from the javascript above. I am not sure if javascript converts the response data type to something else that an <img src can not read? — SpaceApple
– SpaceApple, Commented Mar 14, 2016 at 9:09

Denys Wessels · Accepted Answer · 2016-03-18 07:14:46Z

1

Instead of manually doing an $http.get to generate the chart why don't you just change the image source to point to the partial view and pass through the required parameter (Won or Lost):

$scope.GetChartDetails = function (chartType) {

    var img = document.createElement('img');

    img.src = "/Chart/_GetChartDetails?chartType=" + chartType;

    var node = document.getElementById('chart');

    while (node.hasChildNodes()) {
        node.removeChild(node.lastChild);
    }

    document.getElementById('chart').appendChild(img);

};

answered Mar 18, 2016 at 7:14

Denys Wessels

17.1k16 gold badges85 silver badges121 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

SilentTremor · Accepted Answer · 2016-03-14 10:00:39Z

0

Check your if the image is correct defined:

.success(function (response) {
 var image = document.createElement('img');
 image.onload = function () {
  //if it's correct created you can open it in console (click)and see what your server returns, it may be the correct response but you may have issues with CSS.
  console.log(image);
 };
 image.src = response;
}

Console clickable image:

answered Mar 14, 2016 at 10:00

SilentTremor

4,9622 gold badges25 silver badges38 bronze badges

Collectives™ on Stack Overflow

Loading asp:chart from javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related