Hiding the filter row from the start

8 posts, 1 answers
  1. kieran
    kieran avatar
    19 posts
    Member since:
    Jul 2006

    Posted 25 Nov 2008 Link to this post

    Hi. I am using the technique described in the demo to have a toggle (in my case a check box) that allows the user to hide the filter row.

    This works just fine, but it always starts off visible. Is there a way to have it initially hidden?

    Looking at this thread tempts me to set tableView.get_tableFilterRow().style.display = none, but I'd rather use a published API. I did put an OnGridCreated handler to turn off the row, but the user sees this happening and it fires every time a call back occurs.

    Any ideas?

    Thanks
  2. Answer
    Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 25 Nov 2008 Link to this post

    Hi,

    To hide the filter row initially set the AllowFilteringByColumn property to false in the aspx and set its visibility in the CheckBox CheckChanged event .

    CS:
     protected void CheckBox1_CheckedChanged1(object sender, EventArgs e) 
        { 
            RadGrid1.AllowFilteringByColumn = !RadGrid1.AllowFilteringByColumn; 
            RadGrid1.Rebind(); 
        } 


    Thanks
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. kieran
    kieran avatar
    19 posts
    Member since:
    Jul 2006

    Posted 27 Nov 2008 Link to this post

    Thanks, that sort of works, but it's a bit laggy, or slow.

    There's no way to do it client side?
  5. Vlad
    Admin
    Vlad avatar
    11100 posts

    Posted 28 Nov 2008 Link to this post

    Hello kieran,

    Please check this demo for more info:
    http://demos.telerik.com/aspnet/Prometheus/Grid/Examples/GeneralFeatures/Filtering/DefaultCS.aspx

    Regards,
    Vlad
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. kieran
    kieran avatar
    19 posts
    Member since:
    Jul 2006

    Posted 01 Dec 2008 Link to this post

    Yeah, that's the demo I'm basing my code on.

    It doesn't show me how to start off with the filter row hidden though.
  7. Sebastian
    Admin
    Sebastian avatar
    9934 posts

    Posted 02 Dec 2008 Link to this post

    Hi kieran,

    You may consider invoking the hideFilterItem() client method intercepting the OnGridCreated client-side event and stopping the method invocation (if you want to show the filter item at some point) on subsequent submits based on your custom logic.

    Best regards,
    Sebastian
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  8. kieran
    kieran avatar
    19 posts
    Member since:
    Jul 2006

    Posted 02 Dec 2008 Link to this post

    Yeah, I tried that early on, but it looks horrible. I'm going to settle for Shinu's initial solution, although I'd really prefer no postback.
  9. Simon
    Simon avatar
    9 posts
    Member since:
    Jan 2008

    Posted 18 Dec 2008 Link to this post

    Keiron

     

    I have just come across the same requirement, and have used the following work around to get it functioning as I required:

     

    1)      Ensure that the Checkbox you want to use to toggle the display of the Filter Row is server side, you need this to manage the Filter Row visibility between PostBacks

     

    <asp:CheckBox runat="server" id="chkShowFilter" onclick="ToggleFilter();" />

     

    2)      Handle the Grid’s ItemDataBound event, use this to add a custom attribute to the FilterRow

     

    protected void grdProducts_ItemDataBound(object sender, GridItemEventArgs e)

    {

    if (e.Item.ItemType == GridItemType.FilteringItem)

    {

    e.Item.Attributes.Add("isFilterRow", "1");

     

    if ( e.Item.Style["display"] != null)

        e.Item.Style.Remove("display");

     

    if (!chkShowFilter.Checked)

        e.Item.Style.Add("display", "none");

    }

    }

     

    3)      Create a Javascript method to get the <TABLE> element of the Grid’s MasterTableView (you can’t use get_masterTableView() as this doesn’t allow to extract a collection of all TRs)

     

        function ToggleFilter() {

     

       var chkShowFilter = document.getElementById('<%=chkShowFilter.ClientID %>');
       var grid = $find('<%=grdProducts.ClientID %>');

     

     

    var tblMasterTable = document.getElementById(grid.get_masterTableView().get_id());

    var tableRows = tblMasterTable.getElementsByTagName('tr');

    var filterRowId = -1;

     

    if ( tableRows != null ) {

     

    for(i = 0; i < tableRows.length; i++) {

    var isFilterRow = tableRows[i].getAttribute('isFilterRow');

     

    if ( isFilterRow != null && isFilterRow == '1' ) {

    filterRowId = i;

    } 

    }

     

    if ( filterRowId > -1 ) {

    if ( chkShowFilter.checked ) {

        tableRows[filterRowId].style.display = '';

    }

    else {

        tableRows[filterRowId].style.display = 'none';

    }

    }

    }

        }

    Hope this helps

    Regards

    Simon 

     

     

     

     

     

     

     

     

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017