1

I have a LinkButton (initially disabled) that needs to be enabled or disabled using jquery, but it seems like disabling the button with the method I'm using removes the href attribute, so when I re-enable it, the button looks enabled, but it's not clickable.

<asp:LinkButton Id="lbSave" runat="server" Text="Save" Enabled="False" ClientIDMode="Static" />

Disable:
$('#lbSave').attr('disabled', 'disabled');

Enable:
$('#lbSave').removeAttr('disabled');

What's the correct way to enable/disable LinkButtons?

Prabhu
  • 12,995
  • 33
  • 127
  • 210
  • FWIW disabling an anchor client-side *is not* the same as disabling it server side (the rendered html is different via server side disabling) you cannot reliably block the anchor action via setting the disabled attribute client side and I would recommend using a different type of html element or removing the href entirely from the anchor. – Quintin Robinson Oct 31 '12 at 17:14

4 Answers4

5

The problem is that the id of the control in the client browser is not lbSave but WebForms will mangle it into something like ctl00_nameofanynestedaspnetcontainercontrols_morenestedcontainernames_lbSave.

The workaround as suggested by Praveen is, don't try to find the control by id but instead give it a unique classname - which webforms won't mangle - and voila problem solved.

The alternative is to get asp.net to plug the correct id in for you in your markup:

Enable: $('#<%= lbSave.ClientID %>').attr('disabled', '');

Disable: $('#<%= lbSave.ClientID %>').removeAttr('disabled');

(If you're using Asp.Net 4 WebForms this page http://weblogs.asp.net/scottgu/archive/2010/03/30/cleaner-html-markup-with-asp-net-4-web-forms-client-ids-vs-2010-and-net-4-0-series.aspx gives you an alternative simpler solution).

But if you're doing new projects in Asp.Net 4, you really really want to use Asp.Net MVC and all this kind of problem goes away.

Chris F Carroll
  • 11,146
  • 3
  • 53
  • 61
  • That's actually not the issue because I had ClientIDMode="Static" (didn't include here for simplicity, sorry about that). My jquery code is able to find my linkbutton, so there's no problem there. In fact, it does toggle the enabled/disabled "look" of the button. The issue is that when it's enabled, I'm still not able to click on it because it has lost its href attribute. – Prabhu Oct 31 '12 at 17:29
  • Totally agree about the MVC comment. Unfortunately, I'm working on an older project. – Prabhu Oct 31 '12 at 17:36
  • 1
    Gotcha. You have to change Enabled="False" to Enabled="True". If you try this: You'll see that a *serverside* enabled=false does a lot more than setting the disabled property. To disable the button initially do it clientside. – Chris F Carroll Oct 31 '12 at 18:02
2

You can do something like below:

<asp:LinkButton Id="lbSave" runat="server" Text="Save" Enabled="False" CssClass="lbSave" />

Disable: 

$(".lbSave").attr("disabled", "disabled");

Enable: 

$(".lbSave").removeAttr("disabled");

Hope this Helps!!

Praveen
  • 1,449
  • 16
  • 25
  • Sorry just realized that I had it reversed in my description (edited now), but in fact what you posted here is what I have currently. Enabling it does not put the href back. Thanks! – Prabhu Oct 31 '12 at 17:26
  • Try logging the Link Button's Attribute to the Console or just doing an "alert" before and after disabling; which tells us the exact problem. I think there is something else which is going wrong other than jquery you have shown here. – Praveen Oct 31 '12 at 17:31
  • Looking at the source, the linkbutton doesn't have the href attribute to start with when I set the linkbutton to Enabled=False. So the jquery is working fine, because it has no idea about the href attribute to begin with. So the question remains, is it even possible to toggle an ASP.NET LinkButton state using jquery. – Prabhu Oct 31 '12 at 17:45
  • Ok figured it out. I have to keep the LinkButton enabled on page load, save the href attribute using jquery, and then disable the linbutton using jquery. And everytime I reenable, I'll have to put the href back. Thanks for your help. – Prabhu Oct 31 '12 at 17:51
2

try this link disable a hyperlink using jQuery

so you can try

$('#<%= lbSave.ClientID %>').bind('click', false);

to enable

$('#<%= lbSave.ClientID %>').unbind('click', false);

Community
  • 1
  • 1
Albert Oclarit
  • 143
  • 7
0

Setting Enabled=False on an ASP.NET LinkButton removes the href attribute, so jquery can never enable it back. So here's a solution that works for me:

In javascript:
$(document).ready(function() {
  _href = $('#lbSave').attr('href');
  $('#lbSave').attr('disabled', 'disabled');
  $('#lbSave').removeAttr('href');
});

Disable:
$('#lbSave').attr('disabled', 'disabled');
$('#lbSave').removeAttr('href');

Enable:
$('#lbSave').removeAttr('disabled');
$('#lbSave').attr('href', _href);
Prabhu
  • 12,995
  • 33
  • 127
  • 210