how can i replace an image (inside a div) through jquery and ajax.

Posted by oo on Stack Overflow See other posts from Stack Overflow or by oo
Published on 2010-04-20T14:54:45Z Indexed on 2010/04/20 15:03 UTC
Read the original article Hit count: 198

Filed under:
|
|
|

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'>");
  }

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about asp.net-mvc