how can i replace an image (inside a div) through jquery and ajax.
- by oo
I am trying to click on an image and change it to another image through jquery.
When i step through the below code, on the serverside, the controller action fires and on the client side, i can see the correct html return in firebug watch window but the image doesn't change at all. any idea why this div is not updating?
original div:
<div class="inlineDiv" toggle="off" id="22"><img src="../../images/vote-favorite-off1.png" border="0"></div>
jquery code:
$(document).ready(function() {
$('div.inlineDiv').live('click', function() {
var id = $(this).attr("id");
var toggle = $(this).attr("toggle");
var url = '/Tracker/Update?id=' + id + '&toggle=' + toggle;
$.get(url, function(data) {
$(this).html(data);
});
});
});
controller action:
public ActionResult Update(int id, string toggle)
{
if (toggle == "off")
{
return Content("<img src='../../images/vote-favorite-on1.png' border=0'>");
}
return Content("<img src='../../images/vote-favorite-off1.png' border=0'>");
}