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

RadGrid with general TextBox to Search

3 Answers 655 Views

Grid

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

Caio asked on 23 Jul 2013, 02:24 PM

I need build a TextBox to search this text in any column in my Grid.
How I make it?
My grid:

<telerik:RadGrid ID="RadGrid2" DataSourceID="XXX" runat="server"

AllowSorting="True" AutoGenerateColumns="False" GridLines="None">

<GroupHeaderItemStyle HorizontalAlign="Left" />

<MasterTableView Width="100%" AutoGenerateColumns="False" DataSourceID="dbNDriveSecuritySqlDataSource"

GroupsDefaultExpanded="False">

<Columns>

<telerik:GridBoundColumn DataField="sub_folder_path" FilterControlAltText="Filter sub_folder_path column"

HeaderText="sub_folder_path" SortExpression="sub_folder_path" UniqueName="sub_folder_path">

<ItemStyle HorizontalAlign="Left" />

</telerik:GridBoundColumn>

<telerik:GridHyperLinkColumn DataNavigateUrlFields="group_manager" DataNavigateUrlFormatString="groupinfo.aspx?group={0}"

DataTextField="group_manager" FilterControlAltText="Filter column column" HeaderText="Group Manager"

UniqueName="column">

<ItemStyle HorizontalAlign="Left" />

</telerik:GridHyperLinkColumn>

<telerik:GridBoundColumn DataField="ServerName" FilterControlAltText="Filter ServerName column"

HeaderText="ServerName" SortExpression="ServerName" UniqueName="ServerName">

<ItemStyle HorizontalAlign="Left" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="main_folder_path" FilterControlAltText="Filter main_folder_path column"

HeaderText="main_folder_path" SortExpression="main_folder_path" UniqueName="main_folder_path"

Visible="False">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="group_manager" FilterControlAltText="Filter group_manager column"

HeaderText="group_manager" SortExpression="group_manager" UniqueName="group_manager"

Visible="False">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn HeaderText="Access Type">

<ItemTemplate>

<asp:CheckBox ID="CheckBox1" runat="server" Text="Access to Read" OnCheckedChanged="CheckBox1_ChangeCheck"

AutoPostBack="true" />

<asp:CheckBox ID="CheckBox2" runat="server" Text="Access to Modify" OnCheckedChanged="CheckBox2_ChangeCheck"

AutoPostBack="true" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="securityGroupR" FilterControlAltText="Filter securityGroupR column"

HeaderText="securityGroupR" SortExpression="securityGroupR" UniqueName="securityGroupR"

Visible="false">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="securityGroupM" FilterControlAltText="Filter securityGroupM column"

HeaderText="securityGroupM" SortExpression="securityGroupM" UniqueName="securityGroupM"

Visible="false">

</telerik:GridBoundColumn>

</Columns>

<GroupByExpressions>

<telerik:GridGroupByExpression>

<SelectFields>

<telerik:GridGroupByField FieldAlias="main_folder_path" FieldName="main_folder_path" />

</SelectFields>

<GroupByFields>

<telerik:GridGroupByField FieldName="main_folder_path" />

</GroupByFields>

</telerik:GridGroupByExpression>

</GroupByExpressions>

<EditFormSettings>

<EditColumn FilterControlAltText="filter editcommandcolumn column">

</EditColumn>

</EditFormSettings>

</MasterTableView>

<FilterMenu EnableImageSprites="false">

</FilterMenu>

</telerik:RadGrid>

3 Answers, 1 is accepted

answered on 25 Jul 2013, 02:08 PM

I implemented your suggestion but I have a error when make others filters or click No Filter. Works just the first filter. Bellow, my code.
The error is: Uncaught TypeError: Property '$' of object [object Object] is not a function in row 49.

OBS: I get other exemple in your link.
I don't know if will works good, because I have an Group in my Grid and is Collapse all

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Locations.aspx.cs" Inherits="Locations" %>

<%@ Register TagPrefix="Telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">

<title>N Drive Security - Locations</title>

<Telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" />

<script type="text/javascript">

(function () {

var demo = window.demo = {},

autoCompleteBox,

masterTableView;

demo.GridCreated = function (sender, args) {

masterTableView = sender.get_masterTableView();

}

demo.AutoCompleteLoaded = function (sender, args) {

autoCompleteBox = sender;

}

demo.EntryAdded = function (sender, args) {

filterGrid();

}

demo.EntryRemoved = function (sender, args) {

filterGrid();

}

function filterGrid() {

if (!masterTableView || !autoCompleteBox) return;

var entries = autoCompleteBox.get_entries();

if (entries.get_count() === 0) {

masterTableView.expandAllGroups();

return;

}

masterTableView.collapseAllGroups();

$telerik.$(masterTableView.get_element()).find("td").filter(function () {

for (var i = 0; i < entries.get_count(); i++)

if ($(this).text().indexOf(entries.getEntry(i).get_text()) !== -1) return true;

return false;

}).closest(".rgRow, .rgAltRow").each(function () {

masterTableView.expandGroup(this);

});

}

window.pageLoad = function () {

$(masterTableView.get_element())

.find(".rgGroupHeader td")

.not(".rgGroupCol")

.css("cursor", "pointer")

.click(function () {

masterTableView.toggleGroup($(this).closest("tr")[0]);

});

}

})();

</script>

</head>

<link rel="stylesheet" type="text/css" href="./style/body.css" />

<body>

<form id="form1" runat="server">

<Telerik:RadScriptManager runat="server" ID="RadScriptManager1" />

<Telerik:RadSkinManager ID="QsfSkinManager" runat="server" ShowChooser="false" />

<Telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All"

EnableRoundedCorners="false" />

<Telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<Telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<Telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1">

</Telerik:AjaxUpdatedControl>

</UpdatedControls>

</Telerik:AjaxSetting>

</AjaxSettings>

</Telerik:RadAjaxManager>

<Telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">

</Telerik:RadAjaxLoadingPanel>

<div align="center" style="width: auto; height: auto;">

<img src="image/NdriveBanner.png" align="center" />

</div>

<br />

<asp:Label Font-Bold="true" Font-Size="Smaller" runat="server">Locations - Select a location to request access!</asp:Label>

<br />

<Telerik:RadGrid ID="RadGrid1" DataSourceID="SqlDataSource1" runat="server" AllowSorting="True"

AllowPaging="True" AutoGenerateColumns="False" GridLines="None" AllowFilteringByColumn="true">

<PagerStyle Mode="NumericPages"></PagerStyle>

<MasterTableView Width="100%" GroupLoadMode="Client" TableLayout="Fixed" GroupsDefaultExpanded="false">

<PagerStyle Visible="false" />

<GroupByExpressions>

<Telerik:GridGroupByExpression>

<SelectFields>

<Telerik:GridGroupByField FieldAlias="REGION" FieldName="REGION" HeaderText="REGION">

</Telerik:GridGroupByField>

</SelectFields>

<GroupByFields>

<Telerik:GridGroupByField FieldName="REGION"></Telerik:GridGroupByField>

</GroupByFields>

</Telerik:GridGroupByExpression>

<Telerik:GridGroupByExpression>

<SelectFields>

<Telerik:GridGroupByField FieldAlias="MARKET" FieldName="MARKET" HeaderText="MARKET">

</Telerik:GridGroupByField>

</SelectFields>

<GroupByFields>

<Telerik:GridGroupByField FieldName="MARKET"></Telerik:GridGroupByField>

</GroupByFields>

</Telerik:GridGroupByExpression>

<Telerik:GridGroupByExpression>

<SelectFields>

<Telerik:GridGroupByField FieldAlias="LOCATIONNAME" FieldName="LOCATIONNAME" HeaderText="LOCATION NAME">

</Telerik:GridGroupByField>

</SelectFields>

<GroupByFields>

<Telerik:GridGroupByField FieldAlias="LOCATIONNAME" FieldName="LOCATIONNAME"></Telerik:GridGroupByField>

</GroupByFields>

</Telerik:GridGroupByExpression>

</GroupByExpressions>

<Columns>

<Telerik:GridBoundColumn DataField=" ">

<ItemStyle HorizontalAlign="Left" />

</Telerik:GridBoundColumn>

<Telerik:GridHyperLinkColumn DataNavigateUrlFields="IDSERVER" DataNavigateUrlFormatString="PathFolders.aspx?idServer={0}"

DataTextField="SERVERNAME" FilterControlAltText="Filter column column" HeaderText="SERVER NAME"

UniqueName="column">

<ItemStyle HorizontalAlign="Left" />

</Telerik:GridHyperLinkColumn>

</Columns>

</MasterTableView>

<ClientSettings ReorderColumnsOnClient="True" AllowDragToGroup="True" AllowColumnsReorder="True">

<ClientEvents OnGridCreated="demo.GridCreated" />

</ClientSettings>

<GroupingSettings ShowUnGroupButton="true"></GroupingSettings>

</Telerik:RadGrid>

<br />

<div align="center" style="width: auto; height: auto;">

<asp:HyperLink ID="HyperLink2" runat="server" ImageUrl="~/image/home_back_48.png"

NavigateUrl="~/home.aspx">homepage</asp:HyperLink>

</div>

</form>

</body>

</html>