ejGrid: menu filter preview not working with rest service

[Florian Mihalits]

Hello.

I´m using an ejGrid with an asp.net mvc rest service, which works fine.

For filtering I´m using your menu filter. Filtering itself works pretty well, but when you start typing into the filter value box, it displays "no suggestions" although there should be valid suggestions.

Here is a part of my client code (I´m using typescript):

var dataManager = new ej.DataManager({
                url: 'valid-URL',
                adaptor: new ej.UrlAdaptor(),
                crossDomain: true
            });

            self.grid = $("#gridResellers").ejGrid({
                dataSource: dataManager,
                allowPaging: true,
                allowSorting: true,
                allowSelection: true,
                selectionSettings: { selectionMode: ["row"] },
                sortSettings: { sortedColumns: [{ field: "Number", direction: "descending" }] },
                toolbarSettings: {
                    showToolbar: true,
                    toolbarItems: ["add", "edit", "delete"],
                    customToolbarItems: [{ templateID: "#activate" }, { templateID: "#deactivate" }]
                },
                editSettings: { allowEditing: false, allowAdding: true, allowDeleting: false },
                gridLines: ej.Grid.GridLines.None,
                allowFiltering: true,
                filterSettings: { filterType: "menu", enableCaseSensitivity:false, showPredicate: false},
                enableResponsiveRow: true,
                columns: [
                    { field: "Id", isPrimaryKey: true, visible: false },
                    { field: "Locked", headerText: Localization.manager.get("Reseller_Locked"), type: "boolean" },
                    { field: "Number", headerText: Localization.manager.get("Reseller_Number"), type: "string" },
                    { field: "CompanyName", headerText: Localization.manager.get("Partner_Company"), type: "string" },
                    .....
                ],
                toolBarClick(args) {
                    .....
                },
                rowSelected(args) {
                    ....
                },
                actionComplete(args) {
                    ....
                }
            });

And here is a part of my server side code:

public async Task<ActionResult> Resellers(Syncfusion.JavaScript.DataManager dm)
        {
            var resellerService= DependencyResolver.Current.GetService<IResellerService>();
            Syncfusion.JavaScript.DataSources.DataOperations operation = new Syncfusion.JavaScript.DataSources.DataOperations();

            var totalCount = await resellerService.CountTotalAsync();
            var resultList = resellerService.Filter("");
            var totalFiltered = await resellerService.CountFilteredAsync("");

            //Sortierung
            if (dm.Sorted != null && dm.Sorted.Count > 0)
            {
                resultList = (IQueryable<Reseller>)operation.PerformSorting(resultList, dm.Sorted);
            }

            //Filter
            if (dm.Where != null && dm.Where.Count > 0)
            {
                resultList = (IQueryable<Reseller>)operation.PerformWhereFilter(resultList, dm.Where, dm.Where[0].Condition);
                totalCount = resultList.Count();
            }

            //Paging
            if (dm.Skip != 0)
            {
                resultList = (IQueryable<Reseller>)operation.PerformSkip(resultList, dm.Skip);
            }
            if (dm.Take != 0)
            {
                resultList = (IQueryable<Reseller>)operation.PerformTake(resultList, dm.Take);
            }

            var resultListVm = new List<ResellerItemVm>();
            foreach (var item in resultList)
            {
                var itemVm = new ResellerItemVm()
                {
                    Id = item.Id,
                   ...
                };
                resultListVm.Add(itemVm);
            }

            return Json(new { result = resultListVm, count = totalCount }, JsonRequestBehavior.AllowGet);
        }

Any help is appreciated.

Thanks and all the best,

Florian

[Mohammed Farook J]

Hi Florian, 

 

Thanks for contacting Syncfusion Support. 

 

We have validated your provide code and reported issue, we have found the issue when return data form controller to Grid. So we suggest to use the following code example in “DataOperation” 

 

 

[controller] 

 

public async Task<ActionResult> DataSourceAsync(DataManager dm) 

        { 

            Task<int> longRunningTask = LongRunningOperationAsync(); 

            int delay = await longRunningTask; 

            DataResult result = new DataResult(); 

            DataOperations operation = new DataOperations(); 

            var DataSource = from a in new NorthwindDataContext().OrdersViews select a; 

            result.result = DataSource; 

            result.count = DataSource.Count(); 

            if (dm.Search != null && dm.Search.Count > 0) //searching 

            { 

                result.result = operation.PerformSearching(DataSource, dm.Search); 

            } 

            if (dm.Where != null && dm.Where.Count > 0) //Filtering 

            { 

                result.result = operation.PerformWhereFilter(DataSource, dm.Where, dm.Where[0].Operator); 

            } 

            if (dm.Skip > 0) 

                result.result = operation.PerformSkip(result.result, dm.Skip); 

            if (dm.Take > 0) 

                result.result = operation.PerformTake(result.result, dm.Take); 

 

           return Json(dm.RequiresCounts ? (object)result : (object)result.result, JsonRequestBehavior.AllowGet); 

        } 

        public async Task<int> LongRunningOperationAsync()  

        { 

            await Task.Delay(1000); //1 seconds delay 

            return 1; 

        } 

 

 

 

 

In above code example , we have create a simple time delay async task and perform “DataOpeations” like sorting, paging and filtering  in Grid . Please find the screen shot. 

 

 

Filter  choice request in client side:  

 

 

 

Filtering choice value in server side: 

 

 

 

 

Filter choice suggestion List: 

 

 

 

 

After apply filtering grid return  filteredData with success request : 

 

 

 

 

For your convenience we have added a sample and it can be downloaded from the link as follows: 

 

Sample :  https://www.syncfusion.com/downloads/support/directtrac/general/ze/SyncfusionMvcApplication921049206943.zip 

  

Regards, 

J.Mohammed Farook 

[Florian Mihalits]

Hello Mohammed.

Thank you very much.

Your sample didn´t actually solve my problem, but pointed me in the right direction.

Anyway I found out what the problem was and corrected it.

Thank you very much!

All the best,

Florian

[Karthick Kuppusamy]

Hi Florian, 

 

Thanks for the update. 

 

We are happy to hear that your requirement is achieved. 

 

Regards, 

K.Karthick.