Autocomplete Widget inside Grid works with only first 20 records

[Rodrigo]

Hi, i'm using this example for Autocomplete Widget inside Grid using URL Adapter: https://www.syncfusion.com/forums/172719/autocomplete-widget-inside-grid-using-url-adapter

It works well for creating new records. But when editing a record only works fine when the foreign key value is between first 20 rows.

Example:

When adding, only shows first 20 records:

When editing a value between first 20 records displays "Rodriguez"

But, when the foreign key is outside the first 20 records instead of the text, shows the primary key:

I have prepared an example project.

Thank you.

Attachment: mvc_grid_autoComplete_url_bug_89cc973f.zip

[Pavithra Subramaniyam]

Hi Rodrigo,

Our EJ2 AutoComplete component limits the suggestion count to 20 which is the default behavior. you can increase this count by setting the “suggestionCount” property for the AutoComplete component.

function write(args) {

        // render the autoComplete control

        dObj = new ej.dropdowns.AutoComplete({

            dataSource: data,

            value: args.rowData[args.column.field],

            fields: { text: 'ShipName', value: 'EmployeeID' }, placeholder: 'Ship Name',

            // set placeholder to AutoComplete input element

            placeholder: "Select ShipName",

            suggestionCount: 50

        });

        dObj.appendTo(elem);

    }

https://ej2.syncfusion.com/javascript/documentation/api/auto-complete#suggestioncount

Regards,

Pavithra S

[Rodrigo]

Hi Pavithra, thanks for your quick response.

Set the proposed parameter to 2000, works well for the first 100 records... above 100 not working.

Row 100 works ok

Row 101 and above, doesn't work.

The foreign key i'm trying to bind have several thousands of records.

I'm attaching example project with 2k records.

Thank you.

Attachment: mvc_grid_autoComplete_url_rev2_aaa4d12d.zip

[Rodrigo]

Hi Pavithra, any updates on this issue? Regards.

[Rodrigo]

Hi Pavithra, any updates on this issue? Thank you.

[Priyanka Karthikeyan]

Hi Rodrigo,

To address your concern, we have identified two possible solutions that can help you achieve your requirement.

Solution1:

Please note that the AutoComplete component primarily works based on the value field. In order to achieve your desired outcome, you can utilize the value field alone and then bind the value with the text. This approach will allow you to meet your requirements effectively.

Solution2:

If you prefer to bind both the text and value fields, you can utilize the EmployeeID property and the find method to access the respective name value. Once you have retrieved the name value, you can assign it to the AutoComplete component. To provide you with further assistance, we have prepared a sample for your reference, which you can access below:

dObj = new ej.dropdowns.AutoComplete({

            dataSource: data,

            value: args.rowData[args.column.field],

            fields: { text: 'ShipName', value: 'EmployeeID' }, placeholder: 'Ship Name',

            // set placeholder to AutoComplete input element

            placeholder: "Select ShipName",

            suggestionCount: 2000,

            created: function () {

                setTimeout(function () {

                    const searchId = args.rowData[args.column.field]; // Replace with your dynamic Id value

                    const result = (dObj.listData).find(

                    (sport) => sport.EmployeeID === searchId

                    );
 

                   if (result && result.EmployeeID > 100) {
 

                       dObj.value = (result).ShipName;

                    }

                },200)

            }

        });

Regards,

Priyanka K

Attachment: mvc_grid_autoComplete_url_rev2_aaa4d12d_(2)_e127109b.zip

[Rodrigo]

Hi Priyanka, the workaround works fine.

Could be a new feature for new releases to increase the suggestionCount parameter to a much larger number?

Thank you. Regards.

[Priyanka Karthikeyan]

Hi Rodrigo,

 

We apologize for the misunderstanding. When working with more than 100 items in the dropdown, the display may show the item's value (id) instead of the text. This behavior is not dependent on the suggestionCount property. The AutoComplete component operates based on the value field.

 

As we mentioned before, we recommend using the value field alone and binding it with the text. By adopting this approach, you can effectively meet your requirements and prevent the reported issue.

 

Regards,

Priyanka K