Filter reappears when reorder rows

[Ed]

I have a grid is set to normally start out with the filter row appearing. I have several image buttons that execute various server codebhind event handlers to do various things to the grid, including one that is used to toggle whether the filter row is visible or not.

This all worked with RadGrid for ASP.Net.

I have now upgraded to RadGrid for ASP.Net AJAX.  After fixing a few expected things as part of the upgrade, most thigns are working fine.  This includes toggling whether the filter row is displayed, sorting, column resizing, etc.

However, if I hide the filter row, and then drag a column to reorder the columns, the filter row suddenly is displayed again.  If I then hitt my toggle button twice to re-display (already showing) and then hide the filter row again, it does hide again and I am back to where I was.  Is there something different in the settings used to show/hide the filter row from code-behind with radGrid for ASP.Net AJAX that I have to do to prevent reordering of columns from displaying the filter row after I had hidden it?

Thanks,

-Ed

[Sebastian]

Hi Ed,

This is indeed strange and unfortunately I can not say for certain what might be the cause of the abnormal behavior in your case.

Do you use server-side column reordering when you encountered this odd issue? Can you please verify that you rebind grid invoking its Rebind() method when showing/hiding the filter row on the server? Any further details/code snippets can help us determine the reason for the abnormality to address it.

Best regards,
Stephen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Ed]

After re-reviewing the code (some of this was written over 8 months ago - so I wanted to be sure), I can add some details.

First, one mistake on my prior post. it turns out the problem was present with the older RadControls for ASP.net, not just the newer upgraded version.

I suspect the issue is that I am probably not using the right technique to deal with showing/hiding the filter item, though the fact that the only action that causes the problem is column reordering does seem odd. Postbacks for row clicks, sorting, row expansion, etc do not exhibit the problem.  Only reordering rows does it.

That said, here's what my code tries to accomplish.  We have a lot of information the user tends to want to see, so vertical screen real-estate is very important.  This software is used in a medical environment, so scrolling needs to be kept to a minimum so the doctors, nurses, etc can see their data while they are working with patients.  As such, showing the filter row all the time is a waste of vertical space for us - and some screens have multiple grids tiled horizontally and so a filter row visible on each all the time would be even a bigger loss of real estate.  However, we need filters that are set to remain in effect whether or not the filter row is visible.

So what the code does is we have a button that the user can use to toggle the filter row visible or not.  In some apps, the row starts visible, in others it does not, and that is configurable for different customers.  What I found early on with RadControls for ASP.Net when this was written was that if the filter row is used to set a filter, and then the code sets AllowFilterByColumn to false to hide the row, the filter expression also gets cleared, which means the filter the user set would no longer be in effect.  This is not ok for our apps, so I could not toggle the row by toggling that property.

Instead, I have a flag I maintain indicating whether the filter row should be visible or not.  Then, in the PreRender event handler, I have the following code:

GridItem[] items = TheGrid.MasterTableView.GetItems(GridItemType.FilteringItem);
if ((items != null) && (items.GetLength(0) > 0))
{
    items[0].Visible = FilterItemVisible;
}

As you can see, I am getting the items of type FilteringItem, of which I expect there to be 0 or 1 (and that is the case in the debugger - there is always exactly 1), and if I find one, then I set Visible to match the flag I maintain.  Since I do rebind the grid every time my flag changes, this code gets executed and all seems to work fine, except when columns are reordered.  I do not handle column reordering on server side myself.  Rather, I allow the client side RadGrid stuff to handle that.  (although I do seem to get a postback and I don't know what event would be coming in as I don't catch any event for reordering of rows - and the code above in PreRender does set visibility correctly at that point, but it seems to be ignored or overridden somehow - I am thinking by the client javascript side for reordering.)

At any rate, if there is some other technique to allow the filter row visibility to be toggled without losing the filter expression when not visible, I can easily change the code to comply.  Alternately, I suppose we could make a rule that the code could enforce that all filters will be cleared if you reorder columns - and therefore set AllowFilterByColumn to false whenever they reorder (and to true again when they hit our filter toggle) but that could be bad for other performance reasons on some of our data grids that could retrieve a lot of data when no filters are in effect.

-Ed

[Sebastian]

Hi Ed,

Thank you for the thorough explanation and the information concerning your particular code implementation.

Although I am still not able to identify the exact reason for the abnormality (since I am not able to recreate it in my local tests), is switching the visibility of the filtering item purely client-side as shown in this demo viable workaround for your case (using the showFilterItem()/hideFilterItem() methods)? Note that thus the previous filtering criterion will be kept intact as you can see on the example. Furthermore, this will save you unnecessary round trip to the server to change the visibility of the filter item.

I hope this is feasible technique to bypass the discrepancy you encountered.

Kind regards,
Stephen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Ed]

It seems like your suggestion will probably work for me, but I haven't found quite what I need yet, so hopefully you can point me at what I need.

In my case, the controls are added at runtime, so I now have code in there that also sets the client side on click handler for my filter toggle.  However, in my case, since it is a single image button used as a toggle, I have only one handler, to which I pass the clientID of the grid.  From there I know how to find the control.  But I haven't spotted a client side API to call to determine if the filter is currently displayed or not, so I can;t tell when the javascript is called whether it needs to show the filter or hide the filter.  Is there an easy way client-side to detect whether or not the filter is currently displayed?

Thanks,

-Ed

[Sebastian]

Hello Ed,

Unfortunately at the present moment there is no property exposed on the client which to indicate whether the filter item is visible or not. We will consider adding such property to the Client-side API of RadGrid for the upcoming versions of the product.

In the meantime you can determine whether the filter item is shown/hidden by checking the display attribute of the filter item as follows:

var masterTable = $get("<%=RadGrid1.ClientID %>").get_masterTableView();
if(tableView.get_tableFilterRow().style.display == "none")
{
  alert("Filter row hidden");
}
else
{
  alert("Filter row displayed");
}

Best regards,
Stephen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Ed]

Unfortunately, the call:

get_masterTableView()

gives me an error that says "Object does not support this property or method".

What I do is my onClientClick handler is set to the following routine.  I verified in the debugger that the clientid passed to it is, indeed, the correct client id of the RadGrid.

function ToggleFilter(clientid)
{
    var thegrid = document.getElementById(clientid);
    var masterview = thegrid.get_masterTableView();
    if(masterview.get_tableFilterRow().style.display == "none") 
    {
        masterview.showFilterItem();
    }
    else
    {
        masterview.hideFilteritem();
    }
}

Stepping through in the debugger, 'thegrid' does seem to get set to refer to the RadGrid.  Unfortunately, I get the error.

Out of curiosity, I changed it to more closely reflect the way you wrote it and used:

function ToggleFilter(clientid)
{
    var masterview = $get(clientid).get_masterTableView(); 
    if(masterview.get_tableFilterRow().style.display == "none") 
    {
        masterview.showFilterItem();
    }
    else
    {
        masterview.hideFilteritem();
    }
}

Same result.  I do notice that if I use View Source in IE to look at the page, the clientid is really the id of a <div>, (the child of which seems to be a <div> corresponding to the grid header). 

-Ed

[Sebastian]

Hi Ed,

Please excuse me for the mistake that I made in my previous reply - the actual javascript method you need to use is $find(id) which is a shortcut for the findComponent(id) method, namely:

var masterTable = $find("<%=RadGrid1.ClientID %>").get_masterTableView();
if(tableView.get_tableFilterRow().style.display == "none")
{
  alert("Filter row hidden");
}
else
{
  alert("Filter row displayed");
}

This is the proper means to get reference to the client object of RadGrid. Hence your code should look like this:

function ToggleFilter(clientid)
{
    var masterview = $find(clientid).get_masterTableView();
    if(masterview.get_tableFilterRow().style.display == "none")
    {
        masterview.showFilterItem();
    }
    else
    {
        masterview.hideFilteritem();
    }
}

Kind regards,
Stephen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.