I'm currently redesigning the filter menus in our MVC ASP.NET Core project. As of now, they all have the default menu:
I would like to customise the menus according to the columns' data types - have date range pickers for dates, a slider from min to max value for numbers, etc. The main point is to make the process simpler - so the users only need to input a few characters/choose a date/slide to the right number, instead of filling out this complicated configuration.
Some of such components are provided by kendo (e.g. DateRangePicker), others aren't (e.g. the above-mentioned slider; at least I didn't find anything like it), but could be implemented with a custom function. Either way, I can't seem to be able to override the default filter menu.
The only promising suggesstion on how to achieve something like this that I found was:
grid.Columns(c => c.Bound(item.Name)
.Filterable(ftb => ftb.UI("datePickerFilter"))
function datePickerFilter(element) {
element.kendoDateRangePicker({
messages: {
startLabel: "Check-In",
endLabel: "Check-Out"
},
format: "MM/dd/yyyy"
});
}
Hi, I'm using UI ASP.Net core to display some data on a grid. On one of the grid column I need a filter with multi-checkbox and search. I'm doing this by the following code on the view:
columns.Bound(c => c.Affects).Title("Components").ClientTemplate("#=showComponents(data)#").Groupable(false).Width(180).Hidden(true)
.Filterable(fb => fb.Multi(true).CheckAll(true).Search(true).ItemTemplate("filterComponentsTemplate")
.DataSource(ds => ds.Read(r => r.Action("GetComponentsNamesForGridFilter", "Changes"))));
My problem is than the list of components is very very big and I get performance issue on the initial load of the filter menu. I would like to limit the number of components to be displayed to 100 and refresh the list every time a key is pressed on the Search textbox.
How to do that? I cannot find a way to handle events from the filter search textbox.
Hi, I have this Grid which uses Custom Binding for manual skip and take on the server.
After successful Read of data, my problem now is the Search and Filtering feature is now working.
@(Html.Kendo().Grid<MyWebApp.Web.Models.ViewModel>()
Hi,
I tried to set up a DataSource and a Filter Control like in the demo (https://demos.telerik.com/aspnet-core/filter) but i can not get the DataSource working.
I have the kendo v2023.3.1010 JS Files (kendo.all.min.js, kendo.aspnetmvc.min.js) and other controls like buttons, grids, etc all work as expected
My cshtml Page is
[PartialView/_SearchProvision.cshtml]
@using Kendo.Mvc;
@using Model;
@(
Html.Kendo().DataSource<SearchProvisionDto>()
.Name("DS_SearchProvision")
.Ajax(dataSource => dataSource
.Read("GetData", "SearchProvisionDto")
)
)
@(Html.Kendo().Filter<SearchProvisionDto>()
.Name("Filter_PCProvision")
.DataSource("DS_SearchProvision")
.MainLogic(FilterCompositionLogicalOperator.Or)
.ApplyButton()
.ExpressionPreview()
//Fields, FilterExpression
}
Loading the Page shows only, that the DataSource is not initialized
Am I missing something? I dont really understand where the problem might be.
I would like to store filter's state in url. The url should be formed by pressing apply button. When the page with url containing filter information is opened, the filter should consume this information and display on the page.
Hi there,
While working with the Filter Component I was able to export an CompositeFilterDescriptor object on the client side before sending it to the server, the backend is a .net core API.
Unfortunately I tried to use Telerik.Datasource DLL in order to utilize the JSON parsing functionality inside however it seems like they are from two different worlds !
On the Angular side the CompositeFilterDescriptor looks like this
{
"logic": "or",
"filters": [
{
"field" : "unitId",
"operator" : "eq",
"value" : "1005"
}
]
}
On the .NET side the CompositeFilterDescriptor it is expecting something like this
{
"logicalOperator": 1,
"filterDescriptors": [
{
"member": "unitId",
"operator": 2 ,
"value" : "1005"
}
]
}
Summary of Differences
1- Field names are different and hence not parsed properly ( i.e. logicalOperator vs logic, member vs field)
2- Enumerations are sent as strings from Angular but parsed as Integers from Telerik.Datasource
I feel a little bit confused here, is there any library provided by Telerik that I can use to capture the Angular CompositeFilterDescriptor JSON Object received from the client app inside a Web API ?
Hello,
I have an Ajax Kendo grid and would like to apply a filter on load. There is a date column that I would like to get the max date and use that as the initial filter (not hardcoding the value). Is this doable and if so how?
Thanks
D
Hi,
We have a Kendo Grid bound to a ViewModel with a string value that can be null. If we use NullValueHandling.Include in our MVC project Startup NewtonsoftJson.SerializerSettings:
.AddNewtonsoftJson(o =>
{
o.SerializerSettings.ContractResolver = new DefaultContractResolver();
o.SerializerSettings.NullValueHandling = NullValueHandling.Include;
})
this results in the null value being included in the Grid Multi Filter (see attached). If we use NullValueHandling.Ignore, this results in no value being included in the Grid Multi Filter and we can't filter on empty values. This seems odd, as the Grid is bound to a ViewModel which has the property declared on it. In KendoReact Grids, the value is correctly included in the Grid Multi Filter as 'undefined' when using NullValueHandling.Ignore e.g. https://stackblitz.com/edit/react-ycmafw?file=app%2Fproducts.json.
Kind regards,
David
I'm using ASP NET CORE. I have a grid and I enable filtering on a column with .Filterable(). Is there a way to sort the items that appear in the checkbox filter?
EX:
My filter would look like this
And not
When the drop down is displayed.