Hi Henryk,
Thanks for contacting Syncfusion support.
We have analyzed your query and we suggest you to use select event of AutoComplete when using FilterbarTemplate Write method.
Please refer the below code example.
|
[GridFeatures.cshtml]
@(Html.EJ().Grid<MvcApplication14.OrdersView>("FlatGrid")
...
.AllowFiltering()
...
.Columns(col =>
{
col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).Add();
col.Field("CustomerID").HeaderText("Customer ID").FilterBarTemplate(filterbar => filterbar.Create("autoComplete_create").Write("autoComplete_write").Read("autoComplete_read")).Add();
...
})
)
<script>
function autoComplete_create(args) {
return "<input>"
}
function autoComplete_write(args) {
var gridObj = $("#FlatGrid").ejGrid("instance");
var data = ej.DataManager(gridObj.model.dataSource).executeLocal(new ej.Query().select("CustomerID"));
args.element.ejAutocomplete({ width: "100%", dataSource: data, enableDistinct: true, select: ej.proxy(args.column.filterBarTemplate.read, this, args) });
}
function autoComplete_read(args) {
this.filterColumn(args.column.field, "equal", args.element.val(), "and", true)
}
</script> |
In the online sample we have used focusOut event of autoComplete. So after focus out the input field it filters the value. When using select event of autoComplete it will filter after selecting the value from the autoComplete.
We have also prepared a sample that can be downloaded from the below link.
Note: Also we can use the menu filter and excel filter at a time using filterType property in columns. But it is not possible to use filterBar and menu filter at the same time.
Please refer the documentation link:
Please let us know if you need further assistance.
Regards,
Manisankar Durai.
