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

Filter with material skin inside RadPanelBar - no buttons

3 Answers 55 Views
Filter
This is a migrated thread and some comments may be shown as answers.
Beth
Top achievements
Rank 1
Beth asked on 12 Mar 2020, 01:11 PM

Hello,

When I change the skin of a RadFilter to "Material", the button images disappear only if the RadFilter is nested within a RadPanelBar. The Lightweight render mode is applied system-wide along with the skin via web.config. I have attached an image showing the issue. Any ideas what I am doing wrong? The button images appear when I take the RadFilter out of the RadPanelBar. Here is a snippet.

 

<telerik:RadPanelBar ID="pbrAdvSearch" runat="server" Width="100%" ExpandMode="MultipleExpandedItems"
                   RenderMode="Lightweight">
                   <Items>
        <telerik:RadPanelItem Expanded="True" Text="Categories">
                           <ContentTemplate>
                               <p>
                                   To search by category, click the <strong>Add Category</strong> button. Search for multiple categories by clicking this button again. If your multi-category search requires all categories to exist, select <strong>AND</strong>; otherwise, select <strong>OR</strong>.
                               </p>
                               <br />
                               <telerik:RadFilter RenderMode="Lightweight" runat="server" ID="rfCategories"
                                   ExpressionPreviewPosition="Bottom" ShowApplyButton="true" AddExpressionToolTip="Add a Category">
                                   <FieldEditors>
                                       <customEditors:TreeFieldEditor FieldName="Category" DataTextField="CategoryDesc"
                                           DataValueField="CategoryID" DataFieldID="CategoryID" DataFieldParentID="Parent" />
                                   </FieldEditors>
                               </telerik:RadFilter>
                           </ContentTemplate>
                       </telerik:RadPanelItem>                   
                   </Items>
               </telerik:RadPanelBar>

 

3 Answers, 1 is accepted

Sort by
0
Eyup
Telerik team
answered on 17 Mar 2020, 05:55 AM

Hello Beth,

 

I've prepared a sample RadPanelBar web site using the provided code to test this behavior. The RadFIlter icons are loaded on my side both when the filter is inside or outside the panel bar. You can download and run the attached web site using the following steps to verify that it works as expected on your side, too:

1. Open Visual Studio
2. File menu
3. Open option
4. Select Web site and target the web site folder.
5. Include a Bin folder with the Telerik dll assemblies.

 

Regards,
Eyup
Progress Telerik

Get quickly onboarded and successful with UI for ASP.NET AJAX with the Virtual Classroom technical trainings, available to all active customers. Learn More.
0
Beth
Top achievements
Rank 1
answered on 17 Mar 2020, 03:32 PM

I discovered that I was able to see the button images again if I modified the font-family for the buttons, which was being set to "Material icons". I had to do this:

 

.RadPanelBar_Material .p-icon::before {
    font-family: inherit !important;
}

0
Eyup
Telerik team
answered on 20 Mar 2020, 04:21 AM

Hi Beth,

 

I'm glad the issue is now resolved and thank you for sharing your solution with our community.

 

Regards,
Eyup
Progress Telerik

Get quickly onboarded and successful with UI for ASP.NET AJAX with the Virtual Classroom technical trainings, available to all active customers. Learn More.
Tags
Filter
Asked by
Beth
Top achievements
Rank 1
Answers by
Eyup
Telerik team
Beth
Top achievements
Rank 1
Share this question
or