Change image in ASP.NET with jQuery

Question

I got this jQuery script:

function changeImage(e) {
    var nextImg = $(e).attr('nextImage');
    var oldImg = document.getElementById('<%=imgMain.ClientID %>');
    $(oldImg).attr('src', nextImg);

    return false;
}

and this ASP.NET markup:

<asp:LinkButton runat="server" id="lbOne" Text="1" OnClientClick="changeImage(this); return false;" />
<asp:LinkButton runat="server" id="lbTwo" Text="2" OnClientClick="changeImage(this); return false;" />

Code behind:

lbOne.Attributes.Add("nextImage", "some_image");
lbTwo.Attributes.Add("nextImage", "some_image2);

some how it wont change the image src the jQuery script looks okay to me any ideas?

Found the error:

var oldImg = document.getElementById('<%=imgMain.ClientID %>');

need to add '#' like this:

var oldImg = document.getElementById('#<%=imgMain.ClientID %>');

works now. thanks for the comments!

still wont work i checked the source of the page and looked at the liked button it has href:href="javascript:__doPostBack('id','') maybe its because of this? it throws post back? — Villi Katrih
– Villi Katrih, Commented Jul 24, 2011 at 7:51
I'm not sure you can "override" the client side code of LinkButton.. why not use ordinary <a> tags for this? — user447356
– user447356, Commented Jul 24, 2011 at 8:11

rkw · Accepted Answer · 2011-07-24 10:07:42Z

1

Try making a small adjustment so that the postback is completely blocked.

<asp:LinkButton runat="server" id="lbTwo" Text="2" OnClientClick="return changeImage(this);" />

answered Jul 24, 2011 at 10:07

rkw

7,2974 gold badges28 silver badges39 bronze badges

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

Comments

Dave · Accepted Answer · 2011-07-24 08:03:22Z

0

This worked for me when I tested it, but your sample code is missing a qoute after "some_image2 and is missing the imgMain control.

Have you checked in firebug that the JavaScript is firing? and are you sure your page has a reference to jQuery?

edited Jul 24, 2011 at 8:03

answered Jul 24, 2011 at 7:57

Dave

3,8825 gold badges33 silver badges39 bronze badges

6 Comments

Villi Katrih Over a year ago

the quote isnt the problem i just change the image name when i posted the code here probably just missed the quote and imgMain is an asp:Image: <web:Image runat="server" id="imgMain" />

Dave Over a year ago

what is a <web:image control is it not asp:image? or are you using some other add-on to asp.net?

Villi Katrih Over a year ago

private library same as asp:Image with diffrent options

Dave Over a year ago

have you debugged the javascript in firebug? to see if the event is firing and the client ids are pickedup correctly?

Villi Katrih Over a year ago

found the error it should be like that in the jQuery: var oldImg = $('#<%=imgMain.ClientID %>'); forgot the '#' basic...

|

Collectives™ on Stack Overflow

Change image in ASP.NET with jQuery

2 Answers 2

Comments

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related