CodeBetter.Com
CodeBetter.Com
RSS 2.0 via Feedburner
           Do you Twitter? Follow us @CodeBetter

Peter's Gekko

public Blog MyNotepad : Imho { }

Disable an asp.net LinkButton (or HyperLink) without graying it out

I have a web form with a couple of linkbuttons. The linkbuttons serve as tab selectors, clicking one will activate an associated panel. When a panel is selected I don't want the user to select it again, clicking the linkbutton would be an unnecessary roundtrip. I can set the button's enabled property to false but the now the button will be grayed out. But this does not fit the user's impression of having precisely selected that tab.

Many asp.net controls have the AutoPostback property to disable an unintended postback. A linkbutton does not. But there is a very simple way to knock out postback with a snippet of script. This code does exactly what I want

LinkButton1.Attributes["OnClick"] = "return false;";
LinkButton1.CssClass = "HighlitedTab";
 

It sets the clientside click handler to the JavaScript statement return false; Which cancels postback. The appearance of the linkbutton is changed by setting its CSS class, so the user is informed about the status of the button. Both the attributes and the cssclass are included in the linkbutton's viewstate. To restore the control's original state on the next roundtrip you need to reset it from code or disable the control's viewstate.

This also works for a hyperlink. But I do not see a meaningful use for it there. Yet.


Published Sep 28 2005, 03:38 AM by pvanooijen
Filed under:

Comments

Pancha said:

Please see this script. The 'Enabled' property is working fine both for Linkbutton and Hyperlink(in all browsers). Why don't you use it? Even the book says it won't work with Netsacpe?
<Script Runat="Server">

Sub lbtnVisible_Click( s As Object, e As EventArgs )
 If lnkHyperLink.Visible = True Then
   lnkHyperLink.Visible = False
   lbtnLinkButton.Visible = False
   lbtnVisible.Text = "Make Visible!"
 Else
   lnkHyperLink.Visible = True
   lbtnLinkButton.Visible = True
   lbtnVisible.Text = "Make Invisible!"
 End If
End Sub

Sub lbtnEnabled_Click( s As Object, e As EventArgs )
 If lnkHyperLink.Enabled = True Then
   lnkHyperLink.Enabled = False
   lbtnLinkButton.Enabled = False
   lbtnEnabled.Text = "Make Enabled!"
 Else
   lnkHyperLink.Enabled = True
   lbtnLinkButton.Enabled = True
   lbtnEnabled.Text = "Make Disabled!"
 End If
End Sub

</Script>

<html>
<head><title>Display.aspx</title></head>
<body>

<form Runat="Server">

HyperLink:
<br>
<asp:HyperLink ID="lnkHyperLink" NavigateURL="somepage.aspx" Text="Click Here!" Runat="Server" />

<p>
LinkButton:
<br>
<asp:LinkButton ID="lbtnLinkButton" Text="Click Here!" Runat="Server" />

<hr>

<asp:LinkButton ID="lbtnVisible" Text="Make Invisible!" OnClick="lbtnVisible_Click" Runat="Server" />

<asp:LinkButton ID="lbtnEnabled" Text="Make Disabled!" OnClick="lbtnEnabled_Click" Runat="Server" />

</form>
</body>
</html>
# July 28, 2006 1:08 PM

pvanooijen said:

I'm not saying the enabled property does not work. My problem with it is the visual, greyed out, appearance of a disabled link to the user. In my case I almost want to highlight the linkbutton as it represents the choice the user has made. It is un desired to make that same choice again.
# July 29, 2006 6:40 AM

Thomas said:

Excellent, this was exactly what I was looking for, and for the exact same reason that you needed it.  Took me more googling than I expected to find an answer to this.

Thanks!
# August 24, 2006 2:12 PM

Adriano said:

Thanks, I was grateful in find your post.

# October 2, 2006 9:58 AM

Gino said:

Thanx :)

# October 31, 2006 4:17 AM

Iva said:

<asp:LinkButton runat="server" ID="btnLink" OnClientClick="[do something..]return false;">Click...</asp:LinkButton>

# November 23, 2006 11:15 AM

David M said:

Perfect!  This is what I needed.

# December 11, 2006 11:44 AM

T Arthanathan said:

Simple! Yet a great solution!

# February 15, 2007 11:34 AM

jtg72 said:

hi, I think I'm missing something. This solution would fix my problem, but when I add this code and click one of my linkbuttons either the postback still fires, or nothing happens at all.

Here is the code in the .aspx page prior to rendering:

<asp:Linkbutton Runat="server" ID="tab2Select" OnClientClick="MyFunction();return false;"></asp:linkbutton>

Here is the code in the code behind:

private void tab2Select_Click(object sender, System.EventArgs e)

{

pnlRecipes.Visible = false;

pnlHeadlines.Visible = true;

}

Here is the code rendered as HTML:

<a id="tab2Select" OnClientClick="MyFunction();return false;" OnClick="MyFunction();return false;" href="javascript:__doPostBack('tab2Select','')"></a>

Here is the javascript function:

function MyFunction()

{

//does nothing

}

Any suggestions??

thanks.

# March 8, 2007 9:50 PM

pvanooijen said:

What does MyFunction do ? Strike that, return false is enough.

# March 9, 2007 4:40 AM

Rajendra said:

Hi

I want to disable the linkbutton without change the color of the linkbutton what to do?

# May 14, 2007 12:48 AM

pvanooijen said:

My first reaction : don't. It is very confusing for the user, clicking something which just doesn't work.

My second reaction, you could try the cssclass to change the appearence. But I'm not shure wheteher that will work.

# May 14, 2007 4:57 AM

Silversoth said:

Thanks a bunch, I was having the same problem with wanting to disable a button without having to gray it out with enable=false :D

# May 16, 2007 5:33 AM

toy said:

nice post

# May 16, 2007 11:20 AM

Monkiz said:

I think you can event try this...

Event more simplier

LinkButton1.Attributes["href"] = "#";

# June 23, 2007 2:42 AM

pvanooijen said:

I don't think so, as that doesn't cancel the postback,.

# June 25, 2007 3:10 AM

Abhishek said:

However same thing can also be acheived through javascript. We have only remove attributes as like:

LinkControl.removeAttribute('href');

LinkControl.removeAttribute('className');

LinkControl.setAttribute('onclick','return false;');

# June 26, 2007 10:59 PM

pvanooijen said:

There are a thousand ways to do it. But I prefer setting one attribute serverside over fiddling with three attributes client side. Besides that, your third line does exactly the same as my server side code..

# June 28, 2007 7:25 AM

nick bouton said:

for an <asp:hyperlink> tag, you can just set .NavigateUrl = null and that'll disable it without graying it out.

# July 3, 2007 7:35 PM

pvanooijen said:

That's a hyperlink and not a linkbutton. A linkbutton looks like a hyperlink but is usually intended to execute soem code on the same page, in it's onclick.

# July 5, 2007 5:36 AM

Ethan said:

Thanks for the hint!

Also, to anyone else using this hint, you'll probably want to similarly disable the "OnRightClick" attribute.

# July 23, 2007 5:47 PM

de Shan Baptiste said:

umm...hint good...me steal..

# October 9, 2007 6:20 PM

ranjith said:

Thanks man......... Perfect this is the one i am looking at.

# December 14, 2007 1:41 PM

John Brady said:

Check it out!!

# February 4, 2008 9:07 AM

Zephyr said:

Thanks, It help me a lot!

# March 20, 2008 10:54 PM

Akhil Raj said:

hi,  

  nice post. i am searching for this only.

But please help something more.

I used the link button in the grid view only. and i checked some condition in the rowdatabound event and put aboove code. its working fine. but the first time the link button shows the default behaviour. like cursor underline etc.

# June 24, 2008 3:02 AM

pvanooijen said:

mmm, pagelifecycle hell..

Perhaps a final check in the prerender event ?

# June 25, 2008 9:25 AM

John H said:

Cheers mate!  Lucky for me I managed to find this page quite quickly...

# July 18, 2008 9:30 AM

Leave a Comment

(required)  
(optional)
(required)  

Enter the numbers above:
Add
Check out Devlicio.us!

This Blog

Syndication

News