Progress® Telerik® UI for ASP.NET Core Feedback Portal
Back to Feed
Request a Feature Report a Bug
Completed
Last Updated: 30 Jan 2025 17:09 by ADMIN
Release 2024 Q1
Andy
Created on: 02 Apr 2021 12:27
Category: MultiSelect
Type: Bug Report
3
MultiSelect configured for server filtering sends duplicated read request on blur and open

Bug report

MultiSelect configured for server-filtering="true" sends an empty request on focusout

     <kendo-multiselect for="SelectedOrderIds" style="width:100%"
                       placeholder="Select addresses..."
                       datatextfield="ShipName"
                       datavaluefield="OrderID"
                       filter="FilterType.Contains"
                       value="Model.SelectedOrders.Select(x=>x.OrderID)">
        <datasource type="DataSourceTagHelperType.Ajax" server-filtering="true">
            <transport>
                <read url="@Url.Page("Index", "Read")" data="forgeryToken" />
            </transport>
            <schema data="Data">
                <model id="OrderID">
                    <fields>
                        <field name="ShipName" type="string"></field>
                    </fields>
                </model>              
            </schema>
        </datasource>
    </kendo-multiselect>

Reproduction of the problem

TelerikAspNetCoreApp197.zip

  1. Run the attached application
  2. Enter 34, for example, and select the returned item
  3. Click outside of the MultiSelect

Current behavior

An empty request is sent, fetching all data.

Expected/desired behavior

A request should not be sent.

Environment

  • Kendo UI version: 2021.1.330
  • Browser: [all]
6 comments
ADMIN
Mihaela
Posted on: 30 Jan 2025 17:09

Hello Giovanni,

When the server filtering is enabled, each time you enter a search entry (for example, three characters), the component triggers a Read request to the server. This way, the filter value is submitted to the server, and each filter operation is performed server-side.

If you switch to client filtering and the MultiSelect binds to remote data, the complete dataset will be initially requested from the server during the component initialization. Then, when you filter the options, the filtering will be performed client-side, so no additional requests will trigger.

I hope this information will be helpful to you.

Regards,
Mihaela
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Giovanni
Posted on: 27 Jan 2025 09:41

Thanks for the explanation.

If this is the logic I would have a further clarification to ask.

The kendomultiselect control with the server-side filter is also useful because it allows you to show the user a short list of options from which to quickly identify the desired one (certainly present).

What happens after selecting the first option and then downloading the entire dataset (as described by you)? If I go to choose a new element by typing three characters, will I have a new request to the server, the first with the filter and the second complete or at this point having already downloaded the entire dataset will the filter be done client side?

ADMIN
Mihaela
Posted on: 24 Jan 2025 10:05

Hello Giovanni,

Let me explain in detail how the server filtering of the MultiSelect works.

  • The server filtering is enabled, and the MinLength() option, for example, is set to "3".
  • When the user enters a filter value, the MultiSelect will not send a request to the remote endpoint and start the filtering process until the user enters at least three characters.
  • When at least three characters are entered, the Read request with the search entry is triggered and the data is filtered on the server. A reduced portion of the whole dataset is returned from the server when the filtering is completed.
  • The user selects a specified option from the displayed (filtered) options and clicks outside of the MultiSelect.
  • The MultiSelect triggers a Read request (its payload does not contain the filter value) to request all options (the complete dataset). This way, the next time the MultiSelect opens, the user can review all possible options, not only the previously filtered one, and select an option without entering a filter value again.

In short, the benefit of server filtering is that the filtering operation is performed server-side, where the developer can filter and return the dataset based on specific requirements. Also, the initial filter request triggers when a specified number of characters are entered.

When dealing with a larger dataset, to improve the performance and load a fixed amount of options regardless of the dataset size, we recommend using the virtualization feature. It allows you to page and filter the data server-side. When the users scroll through the list of options, the MultiSelect requests the next page of options and reuses the existing options instead of creating new ones. For more information on the virtualization, refer to the following resources:

If any questions arise, please let me know.

Regards,
Mihaela
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Giovanni
Posted on: 17 Jan 2025 14:20

Maybe I didn't understand well in which context this control should be used.

I understood that in the presence of a large amount of data to be listed in the combo it was possible to query the server not immediately but only after typing a certain number of characters in order to receive and show a subset of the data (only those that satisfy the search) in acceptable times.

If I understood your answer correctly, after having done the above, a new query is performed to download all possible data (all options), with an impact on performance that was intended to be avoided.

ADMIN
Mihaela
Posted on: 17 Jan 2025 12:19

Hello Giovanni,

By design, the Read request that triggers when you focus out the MultiSelect input is expected because the next time you open the MultiSelect dropdown, all options must be available (not only these from the last filtering).

The bug that has been fixed was an additional Read request that was triggering when you focus in the input again after the filtering. Here are the steps for reproduction:

  1. Open the dropdown of the MultiSelect.
  2. Enter a search entry and select a specified option from the result.
  3. Focus out the input --> an expected Read request is triggered to load all options.
  4. Focus in the input to open the dropdown --> a non-expected Read request is triggered.

I hope this information will be helpful. If you have any additional questions, don't hesitate to let me know.

Regards,
Mihaela
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Giovanni
Posted on: 10 Jan 2025 14:09

In the v2024.4.1112 version it seems to me that the problem is still present.

Create an account Log In
View
Type
Status
Category