Kendo UI for Vue Native Data Grid with ASP.NET Core Server
You can use ASP.NET Core to enable CRUD and server data operations in the Kendo UI for Vue Native Data Grid. In such scenarios, operations like data paging, sorting, filtering, or grouping are executed server-side.
About the App
The sample application is built by using the Kendo UI for Vue Native Data Grid, the Kendo Data Query packages, and Telerik UI for ASP.NET Core. We are using Telerik UI for ASP.NET Core on the server to help with all operations like filtering, sorting, paging, and grouping. More details about the step-by-step integration of the current example, you can find in this Integration with UI for ASP.NET Core article.
The sample application also shows how to use the Kendo UI for Vue DropDownList component as an editor for complex fields in the Data Grid.
The sample application demonstrates only one of the possible ways to integrate the Kendo UI for Vue
Native GridwithASP.NET Core. As the Grid provides its data operation parameters in JSON format that can be formatted and sent to any server API, you are free to use any other approach supported by your server setup.
Prerequisites
- Vue.js.
- A commercial or trial license for Telerik UI for ASP.NET Core. This license is needed because the application uses the Telerik UI for ASP.NET Core library for the server operations.
- .NET (LTS version).
- Node.js version 6.0 (or later)
How to Run the Demo
To to see the demo implementation and how the different Native components are configured to interact with each other, you can run the Dashboard application locally, by following the below steps:
- Clone or download the kendo-vue GitHub repository.
- In the folder that contains the
kendo-vuerepository, navigate to thekendo-vue-demo-aspnetcore-datafolder. - Double click on the
VueJSCore.slnfile to open the project. - Start the project by clicking on "Debug -> Start Without Debugging" menu or pressing "Ctrl + F5". The first time you start the project all NPM dependencies will be installed automatically and this process may take time.
Styling the Kendo UI for Vue Native components
The Kendo UI for Vue Native components come with customizable Kendo Themes that can style your application in different ways. The Kendo Themes are shipped as a part of the Kendo UI for Vue library. Details about the usage of the different themes, you can find in our Styling documentation article.
