Hey,
i've got kendo grid with filter row, i'm trying to hook-up all filter inputs to custom kendoAutoComplete(...) components.
Every column definition:
...
columns.Bound(x => x.ColumnName).Filterable(x => x.Cell(y => y.Template("onFilterAutocomplete")));
...Template function definition:
function onFilterAutocomplete(e)
{
var columnName = $(e.element).closest('span[data-field]').data('field');
e.element.kendoAutoComplete({
dataSource: {
transport: {
read: {
url: '@urlFilterAutocomplete',
type: 'POST',
data: {
field: columnName,
text: /* ... how to get currently entered text here dynamically? ... */
}
}
}
}
});
}Controller:
[HttpPost]
public async Task<JsonResult> FilterAutocompleteAsync(string field, string text) => Json(/*... db ...*/);1 Answer, 1 is accepted
0
Accepted
Z
Top achievements
Rank 1
Iron
Rank 1
Iron
answered on 17 Jun 2021, 02:26 PM
So, two more things needs to be set in kendoAutoComplete options to get it work:
1) "serverFiltering: true" must be set in dataSource
2) as per documentation data can be function with parameter, i've tried that, but without (1) the paremeter was never set
Current working setup:
function onFilterAutocomplete(e)
{
let field = $(e.element).closest('[data-field]').data('field');
event.element.kendoAutoComplete({
autoWidth: true,
height: 300,
dataSource: {
serverFiltering: true,
transport: {
read: {
url: '@urlFilterAutocomplete',
type: 'POST',
data: options => ({
...extraPageReadData(),
field: field,
text: options.filter.filters.length > 0 ? options.filter.filters[0].value : ''
})
}
}
}
});
}