CODEWITHSUNDEEP
c#javascriptajaxasp.net-mvcimage
NoWar
NoWar

Reputation: 37632

How to update image with JavaScript and ASP.NET MVC?

I use ShowImage() method of the Home controller to show the image generated on fly.

HTML

<img src='@Url.Action("ShowImage", "Home" )' width="267" height="500">

Now I would like to execute some action with AJAX and update that image like this

 $.ajax({
     type: "POST",
     url: '@Url.Action("UpdateUser", "Home")',
     contentType: "application/json; charset=utf-8",
     data: JSON.stringify(params),
     dataType: "json",
     success: function (data) {
         if (data.success.toString() == 'true') {

             // Is it possible update image using JavaScript?


         }
     }
 });

Is it possible to do? Thanks!

Upvotes: 2

Views: 4530

Answers (3)

hutchonoid
hutchonoid

Reputation: 33306

Add an id to your image:

<img id="anImage" src='@Url.Action("ShowImage", "Home" )' width="267" height="500">

Then in your success handler set it as follows:

$('#anImage').attr("src", 'success.png');

If your image is returned as json from your controller, pull it from the data instead:

$('#anImage').attr("src", data.image);

Upvotes: 3

Unknownman
Unknownman

Reputation: 483

Try this for pure javascript

document.getElementById("id of ur img").src="your source goes here";

Upvotes: 0

Adriien M
Adriien M

Reputation: 1185

Your controller can return an Image with the base File method:

public ActionResult Image(string id)
{
     var myStream = new byte[0];
     // your code géneration....
     return File(myStream, "image/jpeg");
}

Than, you change the image src attribute:

$("#image").attr("src", "/MyController/Image/2");

Upvotes: 3

Related Questions