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

RadGrid filtering using a RadComboBox of checkboxes?

3 Answers 825 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Martin Miller
Top achievements
Rank 1
Martin Miller asked on 01 Jul 2009, 02:37 PM

Currently, I have a RadGrid with dropdown list filtering on each column added to the grid programmatically.

 

 

Public Class GridDropdownFilterColumn : Inherits GridBoundColumn
....

 

Dim

 

_column As New Core.RadGrid.GridDropdownFilterColumn

 

...

InboxGrid.MasterTableView.Columns.Add(_column)
...

How can I change the dropdown list in one or more of my columns to contain checkboxes and have the grid filtered on the selected values?

I got the idea from the following example:  
http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/templates/defaultcs.aspx

3 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 02 Jul 2009, 06:40 AM
Hi,

Telerik has introduced the  Grid / Filter Template  feature which  enables you to add any control into the filter row for a particular columns.You can make use of this feature to add the  combobox with checkboxes  for the required column.


Here is just an outline of what you can do. Please modify to suit your requirement.
I have added a radcombobox with chekboxes in the filter template. On each checkbox click we loop through the items in the combobox and concatenate the checked item text. We can then fire an ajax request and pass the argument containing the datafield and  checked values. In the server side you can set the Filter Expression for the  column accordingly.

Ajax Manger Settings:

   
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"
            <AjaxSettings> 
                <telerik:AjaxSetting AjaxControlID="RadAjaxManager1"
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" /> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
            </AjaxSettings> 
        </telerik:RadAjaxManager> 




<telerik:RadGrid ID="RadGrid2" Width="100%"AllowFilteringByColumn="True" runat="server" EnableLinqExpressions="false"
<MasterTableView DataKeyNames="OrderID"
 <Columns> 
 <telerik:GridBoundColumn  
             UniqueName="ContactTitle" 
             DataField="ContactTitle" 
             HeaderText="Contact title" 
             HeaderStyle-Width="200px"
             <FilterTemplate> 
                <telerik:RadComboBox  
                ID="RadComboBox1" runat="server" 
                DataSourceID="SqlDataSource1" 
                DataValueField="ID" 
                DataTextField="ContactTitle" 
                EmptyMessage="All Types"                 
                AllowCustomText="true" Width="240px"
                                <ItemTemplate> 
                                   <div  class="combo-item-template"
                                      <asp:CheckBox runat="server" ID="chk1"  Checked="true" onclick="onCheckBoxClick(this)"/> 
                                <%# Eval("TypeName") %> 
                                   </div> 
                               </ItemTemplate> 
                          </telerik:RadComboBox> 
                        <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server"
 
                    <script type="text/javascript"
                    function onCheckBoxClick(chk) 
                        { 
                        var tableView=$find("<%# ((GridItem)Container).OwnerTableView.ClientID %>"); 
                        var combo =$find('<%# ((GridItem)Container).FindControl("RadComboBox1").ClientID %>'); 
                      //get the collection of all items 
                        var items = combo.get_items(); 
                //enumerate all items 
                for (var i = 0; i < items.get_count(); i++) 
                { 
                    var item = items.getItem(i); 
                    //get the checkbox element of the current item 
                    var chk1 = $get(combo.get_id() + "_i" + i + "_chk1"); 
                    if (chk1.checked) 
                    { 
                        text += item.get_text() + "," ; 
                        values += item.get_value() + ","; 
                    } 
                } 
                //remove the last comma from the string 
                text = removeLastComma(text); 
                values = removeLastComma(values); 
                $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("ContactTitle," + text );    
                            
            } 
                                    
                                </script> 
 
                            </telerik:RadScriptBlock> 
                        </FilterTemplate> 
</telerik:GridBoundColumn> 
 
 

CS:

 
 
 private void RadAjaxManager1_AjaxRequest(object  sender, AjaxRequestEventArgs e) 
 
  if(e.Argumnet.ToString().Split[','][0]=="ContactTitle"
    { 
     //Access the rest of the string and set the filter Expression 
     
    } 
}  


Thanks,
Princy
0
Nisha
Top achievements
Rank 1
answered on 11 Jul 2012, 12:11 PM
Hello,
I have used the code as u mentioned here but i got problem in this line i could not get the break point over this event at server side
also using this line if i select one checkbox from the radcombobox and radcombo is closed i don't get it why does this thing happen?
how do i come up with this problem. how do i get selected values of  checkboxes inradcombobox in radgrid toserver side?
please help me its urgent for me to solve this thing.
$find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("ContactTitle," + text );




0
zozzancs
Top achievements
Rank 1
answered on 15 May 2014, 11:42 AM
OnAjaxRequest was missing:

<
telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
Tags
Grid
Asked by
Martin Miller
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Nisha
Top achievements
Rank 1
zozzancs
Top achievements
Rank 1
Share this question
or