Kendo UI MVC bind Grid to DataSource from MultiSelect widgets - kendo-ui

We are using Kendo UI MVC and need to filter a large number of records and display them in a read-only DataGrid. The page has MultiSelect widgets that each let the user select from a list of distinct values for a specific database column. After the user has entered his selections in the MultiSelect widgets he will click a 'refresh' button to update the grid. The Grid's DataSource.Ajax.Read method should pass the user's selections to the server and display the results in the Grid.
I know how to populate the MultiSelect widgets and how to return data from the server via Ajax but I'm unclear on how to pass the user's selections to Grid.DataSource.Read().
What is the best way for the button to pass the user's selections to the DataSource, fire the Read method, and display the results in the Grid?
EDIT: Putting the widgets inside the Grid's ToolBar will meet our needs.

Embed the widgets in Grid.Toolbar.Template

Related

Kendo UI for MVC combobox autoclearing user entered text

I am working on a page that has a Telerik UI for MVC ComboBox. Currently the ComboBox does not keep user input once the datasource has returned any value from the database. Even if you reload the page, the ComboBox will remember the value from the Datasource and delete any user input once the focus is changed to another input field.
I need the ComboBox to keep user input if they do not select a value from the Datasource populated drop-down. Any help would be appreciated.
So I found the answer on the Kendo UI API reference. If you set the .SyncValueAndText(boolean) to false it will allow custom text to stay in the ComboBox. By default this value is set to true which binds the text and value together.
Here is a link to the API Documentation:
https://docs.telerik.com/kendo-ui/api/javascript/ui/combobox/configuration/syncvalueandtext

How to read datasource of a Kendo DropDownList only once?

(MVC Razor) So on my page I have a Kendo grid which contains a DropDownList within a certain column. Now I don't want to fill data of my dropdownlist from controller (With Viewbag/ViewData) before the page loads because it would slow it down, but instead I'd like to fill the DropDownList data on user click with a call to a controller function, and call the read method only once(on first click). How would I be able to achieve this goal?
Set autoBind property to false. It will cause that dropdown will not be filled by data before user click on it.
After component is initialized dataBound event is started so you can set readonly in it.
Demo here

slick grid - unheck all rows for paging, sorting and search events

I am using SlickGrid with the checkbox selector plugin and the pagination plugin. I want to only allow the user to select rows for the current page. I noticed that slickgrid remembers values that the user selects on a previous page. Only when a user selects a row on the current page does it uncheck the rows on a previous page. Is it possible to uncheck all rows on a page change event.
Similarly if the user does a search I want to unselect all rows.
Same with sorting, unselect all rows for the grid when the user does a sort.
Is it possible to do this?
The checkbox selector plugin was not designed for pager. Whenever you set checkbox as selected using the plugin, it remembers the row indices _selectedRowsLookup of the grid and re-apply the formatting when the grid invalidates. Thus, it will be the same rows check/unchecked on each page.
To achieve what you want, you have to customize the plugin where you need to:
Add a flag/field isSelected to your dataset that store if a record is selected
Set the formatter to check the dataContext.isSelected instead of using the _selectedRowsLookup
Change the handleSelectedRowsChanged to modify the field isSelected to true or false with the correct reference on the current page.
To select the rows of current page, change handleHeaderClick to only modify the rows displayed using the current pagingInfo
To clear the selection, reset the isSelected field to false and invalidate the grid rows.

Kendo UI: Can I use validator to validate row selection

I have KendoUI grid and user can select multiple rows. Before sending form data, user needs to select rows from the Kendo UI Grid. Can i use Kendo UI validator to accomplish this?

Kendo UI grid filter with refresh button

I have a Kendo UI grid and a refresh button. I would like to prevent grid rebinding on filter change. I would like to collect filters into a collection instead. If the user clicks on the refresh button, the grid should be rebinded and the filters should be applied. Is this possible? Thanks.
No, this is not possible out of the box. Clicking the "Filter" button of the grid filter menu would cause immediate filtering.

Resources