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

Show or hide a filter for Grid column in client side

3 Answers 332 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Joey Montambeault
Top achievements
Rank 2
Joey Montambeault asked on 15 Apr 2010, 02:17 PM
Hi expert,

I have a Grid with some columns that allow filters. When the page is rendered for the first time, I hided all filters using this client side code :
function pageLoad(sender, args)
{
    $find('<%=Grid.ClientID %>').get_masterTableView().hideFilterItem();
}

for each column that allow filter, I want to show the filter on the click on this column. I use the ColumnClick event to do that, but I'm not able to do that. I want some client side code like :

function ColumnClick(columnName)
{
        var masterTable = $find('<%=Grid.ClientID %>').get_masterTableView();
        masterTable.get_columns()[columnName].AllowFiltering = true;
}

I know that I can do that using server side code, but I don't want to that.
I hope that you have some Javascript code to acheive my goal.

thank you for you help.

Hakim

3 Answers, 1 is accepted

Sort by
0
Maria Ilieva
Telerik team
answered on 19 Apr 2010, 01:38 PM
Hi Joey,

Here is an example:

          
<script type="text/javascript" language="javascript">     
           
    function filterMenushowing(sender, eventArgs)   
    {     
        if (eventArgs.get_column().get_uniqueName() == "unique_invoice_no")      
        {              
            var menu = eventArgs.get_menu();   
            var items = menu._itemData;   
            var i = 0;   
            while (i < items.length)     
            {     
                if (items[i].value != "NoFilter" && items[i].value != "EqualTo")     
                {     
                    var item = menu._findItemByValue(items[i].value);   
                    if (item != null)   
                        item._element.style.display="none";   
                }     
                i++;     
            }     
        }      
    }  
</script> 

I hope this helps.


Regards,
Maria Ilieva
the Telerik team

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 Public Issue Tracking system and vote to affect the priority of the items.
0
Joey Montambeault
Top achievements
Rank 2
answered on 19 Apr 2010, 07:54 PM
Hi Maria,

Thank you for your help, but I don't know how raise the eventfilterMenushowing.

I put ClientEvents-OnFilterMenuShowing="filterMenushowing", but no thing happen when i clicked on the image.

To more clarify my issue, i post my code over here:

//hide all filters controls on th epage load
       function pageLoad(sender, args)
        {
            var grid = $find('<%=gvUsers.ClientID %>');
            
            if(grid != null)
            {
                grid.get_masterTableView().hideFilterItem();
            }
        }

<telerik:RadGrid ID="gvUsers" runat="server" Skin="Default"
         AutoGenerateColumns="false"
        GridLines="None" PageSize="20" AllowFilteringByColumn="True"
        OnItemCreated="gvUsers_ItemCreated">
       <ClientSettings ClientEvents-OnFilterMenuShowing="filterMenushowing" ></ClientSettings>
      <MasterTableView AllowSorting="True" AllowFilteringByColumn="true">
            <Columns>    
                    <telerik:GridTemplateColumn UniqueName="Profile">
                            <HeaderTemplate>
                                <asp:Literal ID="lit" runat="server" Text="Profile" />
                                 <img id="img1" runat="server" src="../images/download.gif" alt="Show Filter" />
                            </HeaderTemplate>
                            <FilterTemplate>
                                <telerik:RadComboBox ID="ddlProfile" runat="server" Width="120px" />
                            </FilterTemplate>
                  </telerik:GridTemplateColumn>

                 <telerik:GridTemplateColumn UniqueName="Access">
                        <HeaderTemplate>
                                <asp:Literal ID="litRights" runat="server" Text="Rights" />
                                <img id="img2" runat="server" src="../images/download.gif" alt="Show Filter" />
                       </HeaderTemplate>
                       <FilterTemplate>
                                <telerik:RadComboBox ID="ddlRights" runat="server" Width="100px" />
                       </FilterTemplate>
                        <ItemTemplate>
                                <%# DataBinder.Eval(Container.DataItem, "Access")%>
                       </ItemTemplate>
                    </telerik:GridTemplateColumn>   
             </Columns>
       </MasterTableView>
</telerik:RadGrid>

Now, I want to show the filter control  ddlProfile on click on the control img1  and show the filter control  ddlRights on click on the control img2.

Could you show me where i'll put my event to Show the control filter.

Thank you very much.

Hakim
0
Maria Ilieva
Telerik team
answered on 20 Apr 2010, 12:01 PM
Hello Joey,

In your case another option could be to create your own custom RadContexMenu and manually fire the filter command on a particular img click.

Regards,
Maria Ilieva
the Telerik team

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 Public Issue Tracking system and vote to affect the priority of the items.
Tags
Grid
Asked by
Joey Montambeault
Top achievements
Rank 2
Answers by
Maria Ilieva
Telerik team
Joey Montambeault
Top achievements
Rank 2
Share this question
or