Grid Data based on DropDownList

[Joe]

I hope I have what is a simple question, but the answer is eluding me at the moment.  

Background: I have a table where data gets imported into.  Each import is labeled, in a column so that import batches are kept together.

I have a View with a DropdownList that gets populated with a DISTINCT list of those import labels.

What I want to have happen is the grid would initially be empty.  The user will select a label from the dropdownlist, which should then tell the grid to read the data from the database where it matches the UploadLabel selected by the user.

I know I have to create my Grid to that AutoBind is false.  But how do I tell the grid to fetch the appropriate data?  I know I can call the Grid's DataSource.Read method, but where or how do I tell it which data to retrieve? I don't want to do it client side because the import database is very, very, very large.  This is why I want to only return the data corresponding to a specific UploadLabel.

[B]

Add an event to the dropdown that get's fired when you select an item then call a javascript function to filter based on that data.  Something like this:



       function showDataSources(e) {
    
           var filterValue = $("#dropdown").val();
           var dataSourcesGrid = $("#DataSources").data("kendoGrid");
           dataSourcesGrid.dataSource.read({ value: filterValue });
       }
   
where value is the name of a controller parameter.

[B]

Add an event to the dropdown that get's fired when you select an item then call a javascript function to filter based on that data.  Something like this:



       function showDataSources(e) {
    
           var filterValue = $("#dropdown").val();
           var dataSourcesGrid = $("#DataSources").data("kendoGrid");
           dataSourcesGrid.dataSource.read({ value: filterValue });
       }
   
where value is the name of a controller parameter.

[Joe]

Thanks.  While your response was not the exact answer I was looking for, it was enough to spark my memory of how I did it before.  Very similar.

When the user selects an option in the drop down, I set a javascript variable, and in the Grid as part of it's Read action I have a .Data("scriptFunction") which builds an appropriate JSON object with the upload label I want from that variable.  Next step is to convert it to a MVVM viewModel, but so far it's working as I expect it to.

[Stefan]

Hello, Joe, Smith,

Smith, thank you for providing a solution to the question, this is highly appreciated.

Both approaches are valid:

1) Passing the DropDown value to the read method of the dataSource:

https://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-read

2) Setting a JavaScript function which will create and send additional data:

https://docs.telerik.com/aspnet-mvc/helpers/grid/binding/ajax-binding#pass-additional-data-to-action-methods

Regards,
Stefan
Progress Telerik