Cannot set Filter control width.

8 posts, 1 answers
  1. Gary
    Gary avatar
    14 posts
    Member since:
    Sep 2008

    Posted 20 Aug 2009 Link to this post

    Just starting with RadGrid control.  Adding and configuring the basic for the grid was easy.  Had problems with getting the column to set to a specific width, but fix that issue with TableLayout attribute to "Fixed" instead of "Auto".  The problem I'm having now is the Filter controls are too wide.  So I tried to used the "FilterControlWidth" attribute for the column, but it's not working.  What am I missing?  See code below.  TIA, Gary

        <telerik:RadGrid ID="rgDCR" runat="server" AllowFilteringByColumn="True"   
            AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False"   
            DataSourceID="BCRDataSource" GridLines="Vertical" Skin="Hay" > 
            <ClientSettings AllowColumnsReorder="true">  
            </ClientSettings> 
            <MasterTableView datakeynames="BCRkey" datasourceid="BCRDataSource" TableLayout="Fixed">  
                <Columns> 
                    <telerik:GridHyperLinkColumn   
                        HeaderText="BCR Request No."   
                        SortExpression="BCRRequestNumber" 
                        DataTextFormatString="{0}" 
                        DataNavigateUrlFields="BCRkey" 
                        UniqueName="BCRRequestNumber" 
                        DataNavigateUrlFormatString="~/BCRRequest.aspx?BCRPKey={0}" 
                        DataTextField="BCRRequestNumber" 
                        FilterControlWidth="40px" 
                        > 
    <HeaderStyle Width="60px"></HeaderStyle> 
                    </telerik:GridHyperLinkColumn> 
                    <telerik:GridBoundColumn   
                        DataField="BCRRequestedDate"   
                        DataType="System.DateTime"   
                        HeaderText="Request Date"   
                        SortExpression="BCRRequestedDate"   
                        UniqueName="BCRRequestedDate"   
                        DataFormatString="{0:dd-MMM-yyyy}" 
                        FilterControlWidth="40px" 
                        > 
    <HeaderStyle Width="60px"></HeaderStyle> 
                   </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn   
                        DataField="BCREffectiveDate"   
                        DataType="System.DateTime" 
                        HeaderText="Effective Date"   
                        SortExpression="BCREffectiveDate"   
                        UniqueName="BCREffectiveDate"   
                        DataFormatString="{0:dd-MMM-yyyy}" 
                        FilterControlWidth="40px" 
                        > 
    <HeaderStyle Width="60px"></HeaderStyle> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn   
                        DataField="BCRDescription"   
                        HeaderText="Request Description"   
                        SortExpression="BCRDescription"   
                        UniqueName="BCRDescription" 
                        FilterControlWidth="180px" 
                        > 
    <HeaderStyle Width="200px"></HeaderStyle> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn   
                        DataField="BCRFirstName"   
                        HeaderText="First Name"   
                        SortExpression="BCRFirstName"   
                        UniqueName="BCRFirstName" 
                        FilterControlWidth="40px" 
                        > 
    <HeaderStyle Width="60px"></HeaderStyle> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn   
                        DataField="BCRLastName"   
                        HeaderText="Last Name"   
                        SortExpression="BCRLastName"   
                        UniqueName="BCRLastName" 
                        FilterControlWidth="40px" 
                        > 
    <HeaderStyle Width="60px"></HeaderStyle> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn   
                        DataField="BCRStatus"   
                        HeaderText="Status"   
                        SortExpression="BCRStatus"   
                        UniqueName="BCRStatus" 
                        FilterControlWidth="40px" 
                        > 
    <HeaderStyle Width="60px"></HeaderStyle> 
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn   
                        DataField="BCRLastUpdated"   
                        DataType="System.DateTime"   
                        HeaderText="Last Updated"   
                        SortExpression="BCRLastUpdated"   
                        UniqueName="BCRLastUpdated"   
                        DataFormatString="{0:dd-MMM-yyyy}" 
                        FilterControlWidth="40px" 
                        > 
    <HeaderStyle Width="60px"></HeaderStyle> 
                    </telerik:GridBoundColumn> 
                </Columns> 
                <FilterItemStyle Width="50px" /> 
            </MasterTableView> 
        </telerik:RadGrid> 
        <asp:ObjectDataSource ID="BCRDataSource" runat="server" SelectMethod="SelectRows" TypeName="BLL.BCRBLL"></asp:ObjectDataSource> 
  2. Answer
    Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 21 Aug 2009 Link to this post

    Hi Gary,

    I tried setting the FilterControlWidth property for the Grid Column and it is working fine. I am not sure what is happening on your end. One another suggestion will be to set the width for the filter textbox in the code behind as shown below.

    CS:
     
    protected void rgDCR_ItemDataBound(object sender, GridItemEventArgs e)  
        {  
            if (e.Item is GridFilteringItem)  
            {  
                GridFilteringItem filterItem = (GridFilteringItem)e.Item;  
                ((TextBox)filterItem["BCRRequestedDate"].Controls[0]).Width = Unit.Pixel(40);  
            }  
       }   


    Princy
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Gary
    Gary avatar
    14 posts
    Member since:
    Sep 2008

    Posted 21 Aug 2009 Link to this post

    Princy,

    The code-behind worked, but it's unfortunate that the markup didn't work.  I was able to do everything required in markup except set the filter control width.  I thought maybe the div html tag around the grid might be causing the problem, but it was not.  Although, it did change the size of filter controls, but many were still overlapping.  At this point, I'm just happy to see it work and be able to move on to my next task.  Thanks, Gary.
  5. Roger
    Roger avatar
    3 posts
    Member since:
    Apr 2015

    Posted 04 Jun 2015 Link to this post

    Hi Gary,Princy,

    I want to try same but in my case i don't know the column name  

    protected void rgDCR_ItemDataBound(object sender, GridItemEventArgs e)  
        {  
            if (e.Item is GridFilteringItem)  
            {  
                GridFilteringItem filterItem = (GridFilteringItem)e.Item;  
                ((TextBox)filterItem[ ].Controls[0]).Width = Unit.Pixel(40);  
            }  
       }  

    May i know what am I missing or what can i use in this case.

  6. Eyup
    Admin
    Eyup avatar
    3005 posts

    Posted 09 Jun 2015 Link to this post

    Hello Roger,

    You can achieve this requirement using the following approach:
    protected void RadGrid1_DataBinding(object sender, EventArgs e)
    {
        foreach (GridColumn col in RadGrid1.MasterTableView.RenderColumns)
        {
            col.FilterControlWidth = 40;
        }
    }

    Hope this helps. Please give it a try and let me know if it works for you.

    Regards,
    Eyup
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  7. Roger
    Roger avatar
    3 posts
    Member since:
    Apr 2015

    Posted 09 Jun 2015 in reply to Eyup Link to this post

    Thanks Eyup, But it appears to work only for few fields. I have set the FilterControlWidth to 10, so as to make it more distinguishable. Please check the attached image. The data is from AdventureWorks2008 database (Sample Database provided by Microsoft) - if you wish to replicate at your side. I think the problem is the DataType of the column, not sure though. please let me know, how can i fix this.

    Setting FilterControlWidth programmatically is even weird on column of DateTime Datatype. It would be great if you can also tell me how to set the width to 100% of the column size. 

     

  8. Roger
    Roger avatar
    3 posts
    Member since:
    Apr 2015

    Posted 10 Jun 2015 in reply to Eyup Link to this post

    Thanks Eyup, It did really work!. Actually while i was trying to fix this, i have added some style to width through css for filter textboxes. As soon as i removed it, everything looked fine. I was also able to set the width in percentage as shown below.

    col.FilterControlWidth = Unit.Percentage(80);

    Thanks again for all your help.

  9. Eyup
    Admin
    Eyup avatar
    3005 posts

    Posted 12 Jun 2015 Link to this post

    Hello Roger,

    I'm glad the suggested solution has proven helpful.
    The advantage of this approach is that it is generic for all kind of columns and it is set only once instead of manually setting it for every column defined in the aspx page.

    Regards,
    Eyup
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017