Customize the text box inside the filter cell

2 Answers 88 Views
GridView
levenzer
Top achievements
Rank 1
Iron
levenzer asked on 04 Jun 2022, 01:19 PM

Hi.

How can i customize the textbox inside the filter cell? 

I want the borders of this textbox to appear all the time, not just when in edit mode.

The filter row and filter cell are easy to customize. 
 

private void rgvCompanyList_ViewRowFormatting(object sender, RowFormattingEventArgs e) { if (e.RowElement is GridFilterRowElement) { e.RowElement.RowInfo.Height = 40; e.RowElement.BorderBoxStyle = BorderBoxStyle.FourBorders; e.RowElement.BorderWidth = 4; e.RowElement.BorderColor = Color.Red; } }

 


private void rgvCompanyList_ViewCellFormatting(object sender, CellFormattingEventArgs e)
        {
            if (e.CellElement is GridFilterCellElement)
            {
                e.CellElement.DrawBorder = true;
                e.CellElement.BorderBoxStyle = BorderBoxStyle.FourBorders;
                e.CellElement.BorderWidth = 2;
                e.CellElement.BorderColor = Color.Red;
                Font font = new Font(e.CellElement.Font.Name, 9, FontStyle.Bold);
                e.CellElement.Font = font;
                e.CellElement.TextAlignment = ContentAlignment.MiddleCenter;
            }
        }


But I couldn't find how to access the text box inside the cell. 

I want the borders of this text box to be always visible, as seen in the image below.

private void rgvCompanyList_ViewCellFormatting(object sender, CellFormattingEventArgs e)
        {
            if (e.CellElement is GridFilterCellElement)
            {
                
                e.CellElement.DrawBorder = true;
                e.CellElement.BorderBoxStyle = BorderBoxStyle.FourBorders;
                e.CellElement.BorderWidth = 2;
                e.CellElement.BorderColor = Color.Red;
                Font font = new Font(e.CellElement.Font.Name, 9, FontStyle.Bold);
                e.CellElement.Font = font;
                e.CellElement.TextAlignment = ContentAlignment.MiddleCenter;
            }
        }

2 Answers, 1 is accepted

Sort by
0
Dinko | Tech Support Engineer
Telerik team
answered on 06 Jun 2022, 11:44 AM

Hi Levenzer,

Thank you for the provided code snippet.

The TextBox is dynamically added when the user clicks on the filter cell. If I understand correctly you want to add a permanent editor. This can be achieved by creating a custom filter cell. I think the Permanent editor in a filter cell KB article is what you are looking for. You can use the approach in the KB article and add a RadTextBoxEditorElement which will be permanently visible.

I hope this approach will work for you.

Regards,
Dinko
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

0
levenzer
Top achievements
Rank 1
Iron
answered on 27 Jun 2022, 01:31 PM

Hi Dinko. 

Thank you for reply.

I reviewed the article you mentioned; but I couldn't set it to my own project. Frankly, it was a bit complicated for me. I left it as it is for now; I will try again later.

Dinko | Tech Support Engineer
Telerik team
commented on 28 Jun 2022, 07:27 AM

Take your time to test this approach. In the meantime, there is a complete project demonstrating the approach in the KB in our GitHub repository. You can download the project and debug it. I think this way it will be easier to see how this is implemented.
Tags
GridView
Asked by
levenzer
Top achievements
Rank 1
Iron
Answers by
Dinko | Tech Support Engineer
Telerik team
levenzer
Top achievements
Rank 1
Iron
Share this question
or