Controlling the appearance of disabled pagination links (a[disabled="disabled"]) rendered by a DataPager

I have a datapager with next and previous buttons as so:

   <asp:DataPager ID="dpFeaturedPager" PagedControlID="lvFeaturedTips" QueryStringField="ftpg" PageSize="1" runat="server">
        <Fields>            
            <asp:nextpreviouspagerfield ButtonCssClass="featured-previous" PreviousPageText="Previous" ShowNextPageButton="false" />
            <asp:nextpreviouspagerfield ButtonCssClass="featured-next" NextPageText="Next" ShowPreviousPageButton="false" />
        </Fields>
    </asp:DataPager>   

When there is only one page available, the Next and Previous links are rendered as so:

<a disabled="disabled">Previous</a>
开发者_如何学Python

I have not seen this disabled tag before, and presume it's coming from the datapager control which I won't be able to control.

As usual, this is fine on FireFox but on IE7 the Previous and Next text does not render correctly - it is outlined (what I would expect disabled to look like to be honest - but looks a bit ugly in the page!)

Can I control this in CSS, or is this a known issue?

Thanks Duncan

Check out this thread on StackOverflow, they have some suggestions on CSS styling for disabled links and controls. Hope it helps!

a[disabled=disabled] { 
  color: red; 
  font-weight: bold;
  border: 0px;
} 

Edit: Doesn't look like the selector attribute will work in IE6.

You cannot set color of disabled control in IE. You can change background or border, but the color will always stay gray with white shadow (system color). It does not work even in IE9. Thread about this issue: How to change color of disabled html controls in IE8 using css.

Quick solution using jQuery removeAttr():

$('a').removeAttr('disabled');

This:

<a disabled="disabled">Sad</a>

Becomes This:

<a>Happy</a>

I added a class of 'btnDisable' to both the next and previous links then used CSS...

span .btnDisable {cursor: not-allowed; }
span a.btnDisable {cursor: pointer; }

Just make sure you set RenderDisabledButtonsAsLabels to True.

For those that still look for this issue, from .net 4.0 you have the possibility to define in the web.config file the HTML compatibility for .net controls.

<pages controlRenderingCompatibilityVersion="4.0" clientIDMode="AutoID">

Then in the Global.asax.cs you can specify the CSS class .net should apply to disabled controls.

System.Web.UI.WebControls.WebControl.DisabledCssClass = "disabled";