Headers not totally redraw after sort request

[CSurieux]

Hello,

My grid use autogenerated columns and each column may be sorted clientside (see my previous post for declaration minutes ago).
Some headers are wrapped and when I click on them to sort only the first line of the wrapped header is redrawn.

Seems like a bug ?


CS

[Veli]

Hello Christian Surieux,

Testing under the described conditions and the sample RadGrid structure, I get the following result. When sorting by a column that has a wrapped header in multiple lines, only the first line retains the header style, the other lines get the sorted column style. Essentially this causes the grid header to look half styled.

If this is the case for your scenario too, here is what you can do. Attach a client-side event handler to RadGrid's OnColumnCreated event:

<ClientEvents OnColumnCreated="restoreBackground" />

In the event handler function, clear the header cell's background color:

function restoreBackground(sender, args)
{
    args.get_column().get_element().style.backgroundColor = "";
}

Check this out.

All the best,
Veli
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[CSurieux]

Hello Veli,

Thanks for answer.

This being a bug, I would appreciate to know if I should open a ticket to be sure to have a better solution than patching all my grids with client code that I will have to remove may be in next release.

Thanks for giving me more information : will it be fixed in next release ?


Regards
CS

[Veli]

Hello Christian,

Starting with RadControls for ASP.NET AJAX Q1.2009, we recommend styling your grid using CSS classes instead of inline style settings. This approach has two main benefits. The first is that it is better compatible with RadGrid skins and styles, so no other styles will break. The other is in terms of response string size. Setting inline styles causes all elements in the response HTML to have their respective style set:

<td style="....">
...
<td style="....">
...
<td style="....">

This is a large overhead in HTML size and can be reduced to using CSS classes.

As for your case, the layout you are getting is not a bug in RadGrid, as you are manually overriding your "background-color" CSS property for all your sorted column cells. Effectively, this is applied to RadGrid's header too.

The first approach to straighten it out, was to use javascript. Another approach (a recommended one), would be to style your sorted item by overriding RadGrid's applied skin:

div.RadGrid_Default .rgMasterTable td.rgSorted
{
    background-color:Azure;
}

The second approach would be to keep things as they are, and fix the sorted header cell using CSS:

th.rgSorted
{
    background-color:#c4c4c4 !important;
}

Note, that the above background color has been derived from RadGrid's Default  skin and may differ for your case.

Either of  the two approaches will fix the problem without and any further need.

Greetings,
Veli
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[CSurieux]

Hi Veli,

Thanks, seems a more solid answer :)

Concerning style, I agrre on any speed consideration but also understand that you want to keep priorities on Radgrid internal scripts and style could seriously break things.

Asp.net make poor place for including classes definitions in ascx objects: it works ... but without all visual studio support....so I have always been reticent to this usage.

Concerning css, I am using .net themes and everytime I start fiddler and I see all these request for each css in my current theme folder I think something is to imporve here.
Adding css definitions on a large project necessitate a strong organisation, for exemple radgrids are used in more than 20 ascx loaded dynamcally and using potentially more than 15 themes...
But as all my coding is based on themes, I can't decide some other strategy without a lot of thinking.

Should Telerik extend its Radstylesheet manager to css in .net theme !!!


Regards
CS

[Veli]

Hi Christian,

Indeed, performance optimizations require a thoughtful approach in terms of overall styling, page size and HTTP requests. You can decide for your project.

RadStyleSheetManager combines HTTP requests only for CSS files embedded in the project assemblies. It does not reference outer CSS files in project directories.

Regards,
Veli
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[CSurieux]

Yes, please note this as an improvment request for your dev team: being able to include  css in aspn.net current page theme.
Thanks
CS

[Veli]

Hello Christian,

Thank you for the suggestion for improvement.

Kind regards,
Veli
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.