This is a migrated thread and some comments may be shown as answers.

Grid Filter Menu CSS Class?

7 Answers 329 Views
Designs, skins, themes
This is a migrated thread and some comments may be shown as answers.
John Bernard
Top achievements
Rank 1
John Bernard asked on 16 Mar 2007, 03:54 PM
Hi There -

I am trying to skin the filtering menu on the grid.

According to the documentation, a class exists named ".GridFilterRow_Default" - "For Skinning the FilteringItem".  For some reason this class does not exist in any of the skins (Telerik, Default, Classic)

I have read that I need to apply this code to the grid itself:

7 Answers, 1 is accepted

Sort by
0
Per Holmqvist
Top achievements
Rank 2
answered on 19 Mar 2007, 03:56 PM
If you set the grids skin and have the skins folder in the radcontroldirectory you don't nedd to set cssclass.

If you do, please notice that you only write the class and the grid adds she skinname by itself.

<FilterMenu cssclass="GridFilterRow_Telerik"></FilterMenu>
Notice that cssclass only should be GridFilterRow, it is only in the cssfile it is named GridfilterRow_SKINNAME (Here the skinname is Telerik)

If the skin is default it would be in your cssfile GridFilterRow_Default.

Hope this cleared it out for you?

0
Dimo
Telerik team
answered on 20 Mar 2007, 06:54 AM
Hi John,

The filtering menu of the control can be styled through a class assigned through the CssClass property (as you have already found). This topic from the online documentation elaborates on this subject in detail:

http://www.telerik.com/help/aspnet/grid/?grdCustomizingFilteringMenu.html

The GridFilterRow_[SkinName] class from the predefined skins is targeted to define the look and feel of the filter row holding the filter textboxes/images. It is true that this CSS class appears in the HTML by default and you do not need to set it explicitly. There are no extra styles applied to this class in the skin files and that is why it is not listed there. However, you can add custom styles if you want to, by editing the corresponding skin file.

Best regards,
Dimo
the telerik team
0
John Bernard
Top achievements
Rank 1
answered on 22 Mar 2007, 05:48 PM
Hi There,

Thank you for the information.  I don't understand why the FilterMenu class doesn't exist entirely in the skin file.  Unfortunately, I am working with .NET 1.0 and as such, after reading the article above, would appear as though I will be unable to "skin" the font's, etc., that exist within the filter menu.  I did try creating the FilterMenu_Telerik class in the stylesheet, but had no luck.  Is there any way of making this work with the .NET 1.0 version of the grid?  Am I on the correct path?

Thank you!
0
Zhivko Dimitrov
Telerik team
answered on 23 Mar 2007, 10:05 AM
Hello John Bernard,

You are right, this is a limitation of the grid skins - they contain no built-in styles for the Filter row. We will try to fix this for the next release of the component. Meanwhile, there is a way to fix this manually and you are on the correct path.

Without setting any <FilterMenu cssclass="GridFilterRow_Telerik"></FilterMenu> properties in the aspx, open the css and create a css class GridFilterRow_SKINNAME where SKINNAME is the name of the skin of your grid. This css class will be applied to the filtering row of your grid (the tr element). To have full control over the appearance of the filtering row, you will most probably need to style the columns as well - please create another ".GridFilterRow_SKINNAME td" class to apply styling to the td elements of the filtering row as well.

Regards,
Zhivko Dimitrov
the telerik team

Instantly find answers to your questions at the new telerik Support Center
0
John Bernard
Top achievements
Rank 1
answered on 23 Mar 2007, 03:24 PM
Hi there,

Thank you for your response.   I apologize for continuing this thread as the topic would appear quite clear, however, I added the following class:

.GridFilterRow_Telerik td
{
 font: normal 8pt Verdana, Arial, Sans-serif;
 height: 18px;
 background: green;
}

and the actual filter menu that appears when the filter icon is clicked is uneffected, while the filterrow itself changes to green.

Any help is appreciated.
0
Johan
Top achievements
Rank 1
answered on 23 Mar 2007, 03:31 PM
IMHO, the safest bet is to declare it explicitly in the grid declaration as well, works for me.

<style type="text/css">

// individual filter menu items
.GridFilterRow_Telerik td
{
 font: normal 8pt Verdana, Arial, Sans-serif;
 height: 18px;
 background: green;
}
// the whole menu
.GridFilterRow_Telerik table
{
    ..
}
</style>

 <radG:RadGrid ID="RadGrid1"
      AllowFilteringByColumn="true"
      DataSourceID="AccessDataSource1"
      runat="server">
      <FilterMenu CssClass="GridFilterRow_Telerik"></FilterMenu>
    ...


0
John Bernard
Top achievements
Rank 1
answered on 23 Mar 2007, 05:22 PM
That works.  Thank you.  I'll keep an eye on future versions which sound like the class will be intrinsicly referenced.
Tags
Designs, skins, themes
Asked by
John Bernard
Top achievements
Rank 1
Answers by
Per Holmqvist
Top achievements
Rank 2
Dimo
Telerik team
John Bernard
Top achievements
Rank 1
Zhivko Dimitrov
Telerik team
Johan
Top achievements
Rank 1
Share this question
or