AJAX Tabs - Remove, don't disable.

Page Title:

The other day I started having a strange problem with a DetailsView control inside of an AJAX Tab Panel.  When the control would load, the paging links looked normal, but when I'd click on one they would all become disabled.  In actuality, they were only being disabled in appearance since the paging function is associated with an onclick event rather than the actual href of the link.  So why would these all become disabled?

To make things even more confusing, I had another DetailsView control on the next tab over on the page.  This one was almost identical in code, only differing in the data being loaded, and it worked just fine.  I tried many a thing to try and fix it.  The magical Firebug extension was a big help in trying to debug the javascript that the AJAX controls generate.  From what I could tell, something, somewhere thought that these controls should be disabled so on that first post back, all the links disabled attribute was added and set to disabled. 

Next I started looking at what could be causing it to disable, and how to renable it.  I tried various enabled, visible, etc. options but nothing worked.  Finally I started looking at the code around this tab.  Just to see if it was replicatable, I tried switching the order of the two tabs (one working, one not) and behold, the working one did have the same problem and the broken one started working. 

So to make an already long story short, I finally narrowed it down to the one thing that was being disabled, the next tab panel.   As part of the web application, the user has the option to turn certain features off, one of which makes this tab unnecessary.  So in this case I was disabling the tab when not needed.  I had a couple other tabs on the page also not turned on but they weren't causing a problem.  The key was how I turned them off.  Instead of disabling the tabs, I was actually removing them from the tab container collection. 

I'm sure I'll be the only .NET programmer ever to run into this, but should you ever be in the need to hide a tab, remove it don't disable it.   I have no idea why it makes a difference and would affect the functionality of a control in the tab next door, but now we at least know the fix.

Relevant Tags: AJAX | ASP.NET | JavaScript