dynamic loading of images by linkbutton clicks

[sef]

i have a server-side script that executes this:

linkbutton1.Attributes.Add("onClick", "linkClicked();");

the client-side code has an html image control
<img id="image1">
the client-side javascript function linkClicked looks like
this
void linkClicked(object sender, System.EventArgs e){
image1.src = "test.jpg";
}

what i would want to happen is when the linkbutton is
clicked, the linkClicked() function gets called to change
the image loaded on image1.
However this does not happen and no images are loaded. Any
insights on this?

 

[Ken Cox [Microsoft MVP]]

I assume that you're trying to avoid a postback by using a regular img tag
rather than an ASP.NET image control. In this case, you're really just using
a linkbutton server-side control to generate a client-side hyperlink. Most
everything is client-side script. Don't forget to use return false to
prevent the postback from happening.

How about this?

Private Sub Page_Load _
(ByVal sender As System.Object, _
ByVal e As System.EventArgs) _
Handles MyBase.Load
Dim sb As New System.Text.StringBuilder
LinkButton1.Attributes.Add("onClick", "linkClicked();return false")
sb.Append("<scr")
sb.Append("ipt language='javascript'>")
sb.Append("function
linkClicked(){document.all.item(""cdnimage"").src")
sb.Append("=""http://www.gc.ca/images/francaisbt.gif"";}</script>")
Page.RegisterClientScriptBlock("imgchg", sb.ToString)
End Sub


<P>
<asp:LinkButton id="LinkButton1"
runat="server">LinkButton</asp:LinkButton></P>
<P><IMG id="cdnimage" alt=""
src="http://www.gc.ca/images/englishbt.gif"></P>


Ken

 

[joseph abanila]

Wow, thank you very much Ken! I can't wait to try out that code. Though
I would also like to clear some things a bit:

The function linkClicked() I mentioned was already coded in the HTML as
opposed to your suggestion of dynamically writing the code from
Page_Load (code-behind). Do the two approaches have any difference?

Also, my LinkButtons are also dynamically created from OnInit event so
as to preserve them on post back. I am not so sure that a postback
occurs when I click the linkbutton though, cause nothing happens, the
page is not even reloaded and the image also fails to show. Does this
mean that a postback doesnt occur when I click the linkbutton?

"I assume that you're trying to avoid a postback by using >a regular img tag
rather than an ASP.NET image control. In this case, you're
really just using
a linkbutton server-side control to generate a client-side
hyperlink. Most
everything is client-side script. Don't forget to use return false to
prevent the postback from happening."

Should I wish to avoid this postback so that the image is loaded on the
onClick event of the linkbutton?


Thank you very much!

 

[Ken Cox [Microsoft MVP]]

Hi Joseph,

The function linkClicked() I mentioned was already coded in the HTML as
opposed to your suggestion of dynamically writing the code from
Page_Load (code-behind). Do the two approaches have any difference?

No real difference. I just find it easier to keep as much code as possible
in the code-behind file. Your approach is perfectly valid.

Also, my LinkButtons are also dynamically created from OnInit event so

When you create controls dynamically, you have to handle the viewstate and
event handling on your own. There's a control that will help you do this:

http://www.denisbauer.com/ASPNETControls/DynamicControlsPlaceholder.aspx

Ken

 

[joseph abanila]

Your code works perfectly well. Thanks ken.