RadGrid header initial color wrong but MouseOver color correct

6 posts, 1 answers
  1. Randall
    Randall avatar
    54 posts
    Member since:
    Jun 2008

    Posted 20 Aug 2008 Link to this post

    Hello,

    I have RadControls for ASP.NET AJAX v2008.1.619.

    I have a RadGrid with 3 visible columns and am using the Sunset skin.  The header text forecolor should be white and when moused-over should be a brownish color.  The header text color on columns 1 and 2 are wrong (the brownish color) but the header text color on column 3 is correct (white).  I used View Source and noticed that columns 1 and 2 are rendering with the <span> tag but column 3 is rendering as an anchor <A> tag.

    Any idea why this is happening and how to fix it?

    Thanks,

    Randall Price
  2. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 21 Aug 2008 Link to this post

    Hello Randall,

    The HTML output inside the RadGrid header cells depends on the control declaration and features used. For example if sorting is enabled, the header cells contain <a> elements.

    If you want to have <a>'s in all header cells, please enable sorting for all of them, or use HeaderTemplates.

    Regards,
    Dimo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Randall
    Randall avatar
    54 posts
    Member since:
    Jun 2008

    Posted 21 Aug 2008 Link to this post

    Hello Dimo,

    I do have sorting enabled for all columns in the RadGrid.  Here is the rendered output from View Source for the column headers where you can see that the first two visible columns with text are rendered as <span> and the third visible columns is rendered as <a>:

    <tr> 
        <th scope="col" class="GridHeader_Sunset">&nbsp;</th> 
        <th scope="col" class="GridHeader_Sunset" style="text-align:center;"><span title="Click here to sort" onclick="javascript:__doPostBack('RadGrid1$ctl00$ctl02$ctl01$ctl00','')" style="cursor:pointer;">Index</span></th>  
        <th scope="col" class="GridHeader_Sunset" style="text-align:center;"><span title="Click here to sort" onclick="javascript:__doPostBack('RadGrid1$ctl00$ctl02$ctl01$ctl01','')" style="cursor:pointer;">Initiative</span></th>  
        <th scope="col" class="GridHeader_Sunset" style="text-align:center;"><title="Click here to sort" href="javascript:__doPostBack('RadGrid1$ctl00$ctl02$ctl01$ctl02','')">Responsible Area</a></th>  
        <th scope="col" class="GridHeader_Sunset">&nbsp;</th> 
    </tr> 
     

    I also noticed that the same code renders the column header text forecolor properly in an ASP.NET page, but when I put it on a SharePoint .ASPX page, the column header text forecolor works.  I suspect that I have some CSS affecting the <span> tag on my SharePoint site.  That would explain the color differences, but not why columns 1 and 2 are rendered as <span> and column 3 is rendered as <a>.

    I suppose I could try a HeaderTemplate but I am would like to know what is causing this difference in rendering.

    Any more thoughts on this?

    Thanks,

    Randall Price

  5. Answer
    Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 25 Aug 2008 Link to this post

    Hi Randall,

    I suppose that you have set HeaderButtonType="TextButton" for the columns with <span>'s inside the header cells? The default is LinkButton.

    Greetings,
    Dimo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Randall
    Randall avatar
    54 posts
    Member since:
    Jun 2008

    Posted 25 Aug 2008 Link to this post

    Hello Dimo,

    This was exactly the problem.  I had HeaderButtonType="TextButton" in the GridBoundColumn tags for the first two visible columns and not in the 3rd visible column.  When I removed the HeaderButtonType attribute, the colors rendered correctly.

    Thanks for this great help!

    Randall Price
  7. Randall
    Randall avatar
    54 posts
    Member since:
    Jun 2008

    Posted 25 Aug 2008 Link to this post

    Hello Dimo,

    This was exactly the problem.  I had HeaderButtonType="TextButton" in the GridBoundColumn tags for the first two visible columns and not in the 3rd visible column.  When I removed the HeaderButtonType attribute, the colors rendered correctly.

    Thanks for this great help!

    Randall Price
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017