hello, I have an array of 16'000 object to display in a dropdown.
Of course the standard dropdown is too slow for this, taking as long as 10 seconds to just open, let alone filtering.
So I opted for the DropdownDataGrid, which is super fast, basically instant!
But there is a huge problem, that might be a bug.
My Data is taken from an API (swagger API) and there are 2 scenarios:
I use the page Load event to Invoke my API and save its result to a property, then use this property as Data fro the DropdownDataGrid.
In this scenario, all is fine, the dropdown loads fast, and it has a lot of pages as I'm showing only 10 records per page.
I use the DropdownDataGrid LoadData event : as soon as I use this, or better, as soon as I put ANYTHING inside the LoadData event, even an "execute code" with just a console.log inside. what will happen is, the DropdownDataGrid when opened won't display pages anymore!
So even if I have 16k data, it will just show the first page with the first 10 records.
But as soon as I remove the LoadData content, and open the dropdown again, now it displays all pages!
This is a problem, because even if I Can load the data in the Load event of the page, I still need the LoadData event of the dropdown to take the filter text so I can manually filter out my result object...
Is this a bug?
EDIT: I also just saw that if there is anything inside LoadData, if I try to sort the grid with the values, or use the Search box in the dropdown, it will start an endless loading! But if there isn't anything in LoadData the Sort will work just fine
You need to handle the LoadData event, Invoke your data source method and update the page property. Similar to what Radzen generates automatically during database scaffolding:
thank you @korchev,
but how can I add all those parameters like skip, top, filter ? I see when I console.log the ${event} of the LoadData of the DropdownDataGrid, that those properties are there in the ${event}, but as I'm using an API for the INVOKE Data source method, I can only add properties based on my API, and those are defined, it doesn't let me create "custom parameters" but only select them from a dropdown.
So how can I define those parameters when using an Swagger API as DataSource to make my DropdownDataGrid work?
@korchev I tried "hacking" it, by adding manually in the JSON file of my API that has been generated by radzen, all those parameters, so when I try to Add a parameter in that API call, these fields now will be selectable:
as you can see I added all 5 parameters (search, top, skip, filter, orderby), but this doesn't work, when I open my DropdownDataGrid, it will only display 1 page, load the first 10 rows.
Your REST service should support paging and be capable of returning the requested items. The DropDownDataGrid expects the developer to handle the LoadData event so it returns the requested page of data items.
@korchev ok thank you for the answer, could you give me some simple pointers on what should I change in my REST service?
Would it be enough to make my Endpoint accept those 5 parameters (top, skip, search, orderby, filter), and then do stuff on my DATA based on them, and finally return my result object accordingly?
Will then the DropDownDataGrid magically work and show different pages and not just the first one? Thank you
