How can I use filtering efficiently?

[NHJ]

Hello.

Currently I know how to filter Server true / false and I'm using filterable.

However, both methods have their advantages and disadvantages and are looking for more efficient ways.



1. Server filtering: true
The advantage of this method is that it is very fast.

However, since you only search within the page called Limit, you cannot perform filtering on all data.


2. Server Filtering: false
The advantages and disadvantages of this approach are the opposite of true server filtering.

You can query and filter all the data in the database.

However, if tens of thousands or hundreds of thousands of data passes, there will be a delay of several tens of seconds depending on the network line.


You can also create a custom filter to do a Query, but I don't think it's a good idea because it requires extra work on every field that needs filtering.


Is there a more efficient filtering method inside Kendo?

[NHJ]

Let me correct some of your questions.

Server Filtering (X)
Server Paging (O)


What's the difference between these two?

What I've manipulated true / false is server paging.

[Tsvetomir]

Hi Nam,

Whenever the Kendo UI DataSource should utilize server operations or client-side operations, it is highly recommended to enable all of the operations to be either client-side or server-side. In case there is a mix, unexpected results from the server-side will be returned. 

For instance, if you set the server-paging and client-side filtering, the server would initially return the results only for the first page. And then, the filtering would be done only for the items that are loaded on the first page and not over all of the items in the data source.

If you would like to have server operations, it is recommended to enable all of the server options of the data source:

serverAggregates: true,
serverFiltering:true,
serverGrouping:true,
serverPaging:true,
serverSorting:true

Feel free to get back to me in case additional clarification is needed.

 

Regards,
Tsvetomir
Progress Telerik

[NHJ]

Thank you for your response.

First of all, some of the answers are consistent with their understanding.

"For instance, if you set the server-paging and client-side filtering, the server would initially return the results only for the first page.And then, the filtering would be done only for the items that are loaded on the first page and not over all of the items in the data source. "


It only returns results for the first page, but if you use filtering, isn't there a way to filter on the entire datasource?

Or have you already answered that?

I don't know what each of the five options related to Server mean.
(I've seen the API description, but I don't know. Sorry.)

[Tsvetomir]

Hi Nam,

Essentially, if you would like to use server paging, you should enable all of the other operations - server sorting, server filtering, etc. I will go ahead and explain in details the server operations:

1. Whenever you set the serverPaging option to true, the data source will send one request each time the user changes the pager. Only the data for the specific page will be retrieved from the server-side. Therefore, initially, the grid will request e.g 20 items (depending on the pageSize option). With each pagination, the grid will request another 20 items. 

2. If the serverPaging is disabled, then the grid will request all of the items from the server-side. Whenever the user uses the pager, the data will not be requested because it is already available. Only the contents of the cells will be alternated. 

In case serverFiltering is not set to true and the serverPaging is disabled, the grid will have 20 items available. The filtering will be done based on only those 20 items. Which might be misleading.

If the serverFiltering is disabled and serverPaging is disabled, then the filter will be applied to all of the items because all of the items are available on the client from the very beginning. However, the filter will be applied with the help of JavaScript and whenever large collections are used, this might be a slow operation.

If the serverPaging and serverFiltering are set to true, the filtering will be done on the server-side. For instance, if the user applies a filter, a request will be sent to the server-side. It will be handled and only the filtered items will be returned (the filter will be applied on the whole collection of items).

In conclusion, you should either enable both serverPaging, serverFiltering or disable both.

serverPaging: true, 
serverFiltering: true

Information for each of those is available here:

• https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/configuration/serverfiltering
• https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/configuration/serverpaging

 

Regards,
Tsvetomir
Progress Telerik

[NHJ]

Oh, first I understood your intentions.

But I don't know how to apply it. Sorry.

The function I want to use is

 

filterable: {
                extra: false,
                operators: {
                    string: {
                        contains: "포함 단어"
                    }
                },
                messages: {
                    info : "필터",
                    filter: "검색",
                    clear: "초기화"
                }
            },

 

It is a filterable consisting of the above code.

Perhaps in my personal opinion, this filterable is filtered on the client. Is that right?

If I change server filtering to true, does it work without the need for any additional operations (new code or other operations)?

Please make sure that this is the right way to handle filtering on your server while using filterable.

[NHJ]

There has been a positive change since your response.

Server Filtering: Change to true and test results

{"pageNumber": 0, "pageSize": 20, "filter": {"logic": "and", "filters": [{"field": "plantCd", "operator": "contains", "value ":" 100 "}]}}

This result is achieved.

But there is a problem.
I am not sure how to implement this to be handled by the server.

"pageNumber": 0, "pageSize": 20

In the same case, in the controller
You can put it in a Pageable pageable and use it as pageable.getPageSize (), etc.

But I don't know how to use the filter.

Please tell me how to control this on the server side.

[Tsvetomir]

Hi Nam,

In general, for the ASP.NET Core and ASP.NET MVC wrappers, the Kendo UI library exposes extension methods and custom attributes that parse and format the data in the desired format. So, for instance, you could accept the request as shown here:

        public IActionResult Customers_Read([DataSourceRequest] DataSourceRequest request)
        {
            return Json(GetCustomers().ToDataSourceResult(request));
        }

The request variable contains the filters information sent from the client-side. You could either take the filters and build a query to the database or call the ToDataSourceResult() method over the whole collection that will be automatically filtered and only a portion of the items will be returned to the client-side. 

Let me know in case the backend technology that you are utilizing is neither of the two mentioned above.

 

Regards,
Tsvetomir
Progress Telerik

[NHJ]

Oh sorry, I do not use ASP.

Can you help me with JQuery way?

And if possible, please give me a controller and sample Mybatis XML example.

[NHJ]

RequestMapping(value = "/searchList", method = RequestMethod.GET, produces = APPLICATION_JSON)
    public Responses.PageResponse stdPlantMgtList(
            @RequestParam(value = "searchword", required = false) String searchword,
            Pageable pageable) {

        Map<String, Object> param = new HashMap<>();
        param.put("searchword", searchword);
        param.put("pageSize", pageable.getPageSize());
        param.put("pageOffset", pageable.getPageNumber() * pageable.getPageSize());

        List<TableMap> list = stdPlantMgtService.searchList(param);


        int total = 0;
        if (list.size() > 0) total = Integer.parseInt(list.get(0).get("totalCnt").toString());

        return Responses.PageResponse.of(new PageImpl<>(list, pageable, total));
    }

 

 

<select id="searchList" parameterType="hashmap" resultType="l2u.mes.utils.TableMap">
        <![CDATA[
        SELECT
            STD_PLANT_SEQ
            , PLANT_CD
            , PLANT_NM
            , LINE
            , PROD_SIZE
            , MAKE_NO
            , MAKE_COMP_NM
            , DATE_FORMAT(BUY_DT, '%Y-%m-%d') AS BUY_DT
            , DATE_FORMAT(BUILD_DT, '%Y-%m-%d') AS BUILD_DT
            , RANK
            , SAL
            , RE_MARK
            , USE_YN
            , UPDATED_AT
            , UPDATED_BY
            , CREATED_AT
            , CREATED_BY
            ,(select count(*) from tb_std_plant) AS totalCnt

        FROM    tb_std_plant
        ]]>
        <where>
            <if test="true">
               AND 1=1
            </if>
            <if test="searchword != null and searchword != ''">
                AND PLANT_CD LIKE '%${searchword}%' OR PLANT_NM LIKE '%${searchword}%'
            </if>
        </where>
        order by STD_PLANT_SEQ DESC
        <include refid="pagingPost"/>
    </select>

 

I'll write the XML that handles the controller and server paging I'm currently using.

[Tsvetomir]

Hi Nam,

The Kendo UI DataSource is configured to work with a number of technologies out-of-the-box. For instance, binding to data from the .NET environment, WebAPIs, SignalR, OData, etc.

However, for server-side implementations that are different from the ones provided, the server-implementation has to be handled by the developer. When the data source of the Kendo UI Grid is configured for server filtering, the field, the value, and the operator are sent via query parameters to the server-side. Therefore, you should parse them as you would parse any other ajax request argument array. 

When the grid is initialized, press the F12 key and navigate to the Network tab. Apply a filter to the grid and examine the Request URL option in the headers section of the Network tab. There, you could see how the parameters are sent. 

Another alternative would be to make use of the parameterMap option of the data source. This enables the user to format the parameters in a custom way in order to comply with the server-side logic. More information could be found here:

https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/configuration/transport.parametermap

 

Regards,
Tsvetomir
Progress Telerik

[NHJ]

Oh. I didn't explain it.

I used a parameter map and as a result {"pageNumber": 0, "pageSize": 20, "filter": {"logic": "and", "filters": [{"field": "plantCd", " operator ":" contains "," value ":" 100 "}]}}

Has been passed to the controller.

But I don't know how to "get it".

For example, {"pageNumber": 0, "pageSize": 20}
Data is data related to server paging and can be used as a Pageable object variable in the controller (server). I'm right?

(A format like Pageable pageable / pageable.getPageSize ().)

However, the filter data named "filter": {"logic": "and", "filters": [{"field": "plantCd", "operator": "contains", "value": "100"}]} The data was passed, but I don't know how to get it and use it.

Example [DataSourceRequest] DataSourceRequest request you described on the ASP basis

Please tell me how to implement the part in the controller (server) of Java and JQUERY. Please !!

[Tsvetomir]

Hi Nam,

Thank you for specifying that the server-side implementation is in Java. The Kendo UI library exposes a DataSourceResult object that could be used to gather the incoming parameters:

    @RequestMapping(value = "/remote-data-binding/read", method = RequestMethod.POST)
    public @ResponseBody DataSourceResult read(@RequestBody DataSourceRequest request) {
        // request data based on the request parameters
        // return the data collection
    }

You could check out the following live demo for more information on the implementation:

https://demos.telerik.com/jsp-ui/grid/remote-data-binding

I hope you find this helpful.

 

Regards,
Tsvetomir
Progress Telerik

[NHJ]

I tried that method before your answer.

But it doesn't recognize the DataSourceRequest class.

To be precise, the system I use is Java, Spring, sometimes JPA.

Am I correct that I can use DataSourceRequest in my situation?

error: can not resolve symbol 'DataSourceRequest'

[Plamen]

Hi,

From the description provided it is not quite clear what is not working correctly. You can refer to your Telerik account and download our sample application where there are examples of DataSourceRequest usage.

Hope this will be helpful.

Regards,
Plamen
Progress Telerik

[NHJ]

Oh, please, don't you have another manager?

I am eagerly waiting for your answers. But I'm so upset that you just say "I don't know why? Look at the samples."

Do you not want to help me any other way?

Please do not answer me anymore.

If you don't want to help me, don't reply and forward it to another manager.


The answer doesn't help me in my situation!

[Plamen]

Hello,

Please excuse me if it sounded like I don't want to help and that I hurried up a bit with my answer.

I have inspected the issue deeper and noticed that the DataSourceRequest that we use in our demos for JSP is not part of the Kendo UI library yet it is a separate class that we have created for handling such data manipulations. It is situated in the 'src\main\java\com\kendoui\spring\models\' folder of the project application for our local demos so if you need such behavior you could take it from there.

Hope this information will explain the issue and be more helpful.

Regards,
Plamen
Progress Telerik

[NHJ]

I understood your intentions and found the file.

But I think this is a cumbersome task, so is there a way to simply use a filter object?

I'm looking for an easy object like a Pageable object on a server.

[Plamen]

Hello,

We have not exposed a separated only filter related object that can be used in this situation.

Regards,
Plamen
Progress Telerik

[NHJ]

If so, is there no way to use it as a GET method?

That method uses the POST method, which conflicts with the GET method I use.

POST confirmed that it worked correctly, but instead I had to give up the GET implementation.

Is there any way to implement by GET method?

[Tsvetomir]

Hi Nam,

The Kendo UI DataSource uses the POST methods because it has to send a lot of information regarding the operations of the grid. Internally, the data source uses jQuery ajax requests. And the GET methods are intended for retrieving data as opposed to the POST methods that are could transfer data back and forth. 

Is there a limitation that you have hit with the POST implementation that could be achieved only with a GET method?

 

Regards,
Tsvetomir
Progress Telerik