How to ensure grid has values returned from its Data method

[Blazor]

   

Have a similar scenario as below (taken from example)
https://docs.telerik.com/aspnet-core/html-helpers/data-management/grid/faq

However, in my case, the "additionalData" method is trying to read the values from a Kendo DropDownlist, that has its own .Read method and it appears the Grid is trying to load via its Read method before the dropdown has finished loading via the controller method it calls.  How can I ensure the grids .Data method has all its vallues available before its .Read method is called.  The Dropdown's read method doesnt return in time before it returns its JSON object with one of its values is null and this causes the grid .Read method to take way too long.  

 

// Omitted for brevity.
    .DataSource(dataSource => dataSource.Ajax()
        .Read(read => read
            .Action("Read", "Home")
            .Data("additionalData")
        )
    )
    // Omitted for brevity.
    <script>
        function additionalData() {
            return {
                userID: 42,
                search: $("#search").val()
            };
        }
    </script>

[Alexander]

Hi Blazor,

Thank you for reaching out.

I tried reproducing the encountered behavior within an isolated environment that involves Grid and DropDownList components. Both of them load their data asynchronously but it seems that the Grid obtains the DropDownList's value accordingly.

Nevertheless, a potential alternative to ensure that the Grid retrieves the DropDown's values would be to:

• Explicitly set the .AutoBind() configuration to false. If set to false, the Grid will not bind to the data source during initialization, i.e. it will not call the fetch method of the dataSource instance:
  

@(Html.Kendo().Grid<TelerikAspNetCoreApp449.Models.OrderViewModel>()
    .Name("grid")
    ...
    .AutoBind(false)
)

• Wire to the DropDownList's DataBound event which will be fired once the data is fetched and rendered within the component accordingly:
  

@(Html.Kendo().DropDownList()
    .Name("dropdownlist")
    ...
    .Events(e => e.DataBound("onDataBound"))
)

• Within the DropDownList's handler get a reference of the grid and call the widget dataSource's .read() method:
  

<script>
    function onDataBound(e){
        $("#grid").data("kendoGrid").dataSource.read();
    }
</script>

For your convenience, I am attaching a runnable sample for you to review. Notice, that the sample includes two Grid components one of which uses the conventional way of passing data and the other utilizes the mentioned above approach.

If this does not help, please consider replicating the behavior within the attached sample and send it back for further examination.

That being said, I noticed that there is no Telerik UI for the ASP.NET Core license associated with your account which limits our support services. In this regard, I would recommend renewing or obtaining a new license in order to benefit from all the latest bug fixes, features, and support services that the product provides. More information regarding the support plans can be found here:

• Support Plans

Kind Regards,
Alexander
Progress Telerik