Hi Shannon,
The Grid SearchBox is a special case of the built-in Grid filtering. The ListView is a more visual component and has no built-in filtering at this point, so a SearchBox would have no basis.
It is possible to achieve the same behavior programmatically. Here is an example, which is a modified version of the ListView filtering demo. Notice that I have used a CompositeFilterDescriptor, instead of a FilterDescriptor. The Grid Filtering documentation explains the difference between the two types.
@using Telerik.DataSource
@using Telerik.DataSource.Extensions
<TelerikListView Data="@ListViewData"
Pageable="true"
PageSize="10"
Width="600px">
<HeaderTemplate>
<div style="padding: 1em">
<label for="searchbox">Search in both Name and Descriprtion:</label>
<TelerikTextBox Value="@SearchString" ValueChanged="@LoadListViewData"></TelerikTextBox>
<TelerikButton OnClick="@ClearSearch">Clear</TelerikButton>
</div>
</HeaderTemplate>
<Template>
<div style="display: inline-block; margin: 1em; padding: 1em; border: 1px solid #424242; background: #fafafa;">
<strong>@context.Name:</strong>
<br />
@context.Description
</div>
</Template>
</TelerikListView>
@code {
List<Product> ListViewData;
List<Product> SourceData;
string SearchString = "22";
async Task LoadListViewData(string newSearchString)
{
SearchString = newSearchString;
if (String.IsNullOrWhiteSpace(SearchString))
{
ListViewData = SourceData;
}
else
{
var request = new DataSourceRequest()
{
Filters = new List<IFilterDescriptor>()
};
var cfd = new CompositeFilterDescriptor();
cfd.LogicalOperator = FilterCompositionLogicalOperator.Or;
cfd.FilterDescriptors.Add(new FilterDescriptor("Name", FilterOperator.Contains, SearchString));
cfd.FilterDescriptors.Add(new FilterDescriptor("Description", FilterOperator.Contains, SearchString));
request.Filters.Add(cfd);
ListViewData = (SourceData.ToDataSourceResult(request).Data as IEnumerable<Product>).ToList();
}
}
async Task ClearSearch()
{
SearchString = "";
await LoadListViewData(SearchString);
}
protected override async Task OnInitializedAsync()
{
SourceData = new List<Product>();
for (int i = 1; i <= 50; i++)
{
SourceData.Add(new Product()
{
ID = i,
Name = "Product " + (i * 11).ToString(),
Description = "Description " + (i * 22).ToString()
});
}
LoadListViewData(SearchString);
}
public class Product
{
public int ID { get; set; }
public string Name { get; set; }
public string Description { get; set; }
}
}
Regards,
Dimo
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.