DevExtreme Angular - Scaffolding

DevExtreme Scaffolder for Visual Studio allows you to generate views and API controllers for DevExtreme ASP.NET MVC Controls.

ASP.NET MVC 5:

• Visual Studio 2015 and later
• C#/VB application
• Entity Framework Data Model

ASP.NET Core MVC:

• Visual Studio 2017 and later
• C# application
• Entity Framework Core Data Model

DevExtreme Scaffolder is automatically installed for all compatiable Visual Studio versions by the DevExtreme installer.

Scaffolding helps you automate implementing a controller that follows the guidelines and is compatible with DevExtreme controls.

The scaffolded API controller contains REST actions that perform CRUD operations on entities from the selected data context. Follow the instructions below to scaffold such a controller:

1. In Solution Explorer, right-click the Controllers folder. On the invoked menu, point to Add and then click Controller... or New Scaffolded Item....

   

2. In the Add Scaffold window, choose DevExtreme Web API Controller with actions, using Entity Framework for an ASP.NET MVC 5 app or DevExtreme API Controller with actions, using Entity Framework for an ASP.NET Core MVC app and click Add.

   

3. In the Add Controller window, select the data context and model for which to generate the controller, enter the controller's name, and click Add.

   

   NOTE

   If your project does not contain a data context, generate it by following the Entity Framework Code First to an Existing Database walkthrough for Entity Framework or the Getting Started with EF Core on ASP.NET Core with an Existing Database walkthrough for Entity Framework Core.

Finally, scaffold a DevExtreme control that works with the controller.

DevExtreme Scaffolder enables you to scaffold data-bound DevExtreme controls. You can insert them into an existing view or create a new view. The following articles provide step-by-step instructions for both cases:

Follow the steps below to scaffold a DevExtreme control and insert it into an existing view.

1. Open the view for editing. Right-click on the position in which to insert the DevExtreme control's configuration and click Insert a DevExtreme Control Here in the invoked menu.

   

2. In the wizard, follow the configuration steps, which include choosing which DevExtreme control to scaffold and configuring data binding and related settings. At the last step, click Add to finish the scaffolding.

   

You can also create a new view with a scaffolded DevExtreme control on it. It is an MVC view or a Razor page, depending on the type of project.

1. In Solution Explorer, right-click the folder in which to place the view. On the invoked menu, point to Add and then click View.../Razor Page... or New Scaffolded Item....

   

2. In the Add Scaffold window, choose MVC View with a DevExtreme Control or Razor Page with a DevExtreme Control and click Add.

   

3. In the wizard, follow the configuration steps, which include entering the view's name, choosing the DevExtreme control to scaffold, and configuring data binding and related settings. At the last step, click Add to finish the scaffolding.

   

Finally, reference the view as a partial view or use it as a separate page.