Add Control to a Project

• Sep 09, 2024
• 2 minutes to read

This topic describes how to build a Razor Pages and MVC Web Apps with the Spreadsheet component.

Before start, you should configure your Visual Studio project to use the Spreadsheet component.

Configure Razor Pages Web Apps

If you use a Spreadsheet in a Razor Pages web app, it is necessary to add the following adjustments:

1. Disable the AntiForgeryToken option.

   • To disable the AntiForgeryToken for an application, add the following code in the Program.cs file:

   builder.Services.AddMvc().AddRazorPagesOptions(o => {
       o.Conventions.ConfigureFilter(new Microsoft.AspNetCore.Mvc.IgnoreAntiforgeryTokenAttribute());
   });
   

   • Add the following code to a page model to disable the AntiForgeryToken for a page:

   [IgnoreAntiforgeryToken]
   public class IndexModel : PageModel {
       public void OnPost() {
       }
   }    
   

2. Add the following code to the app.UseEndpoints function to access an MVC Controller action in Razor Pages.

   app.UseEndpoints(endpoints => {
       endpoints.MapRazorPages();
       endpoints.MapControllerRoute(name: "default", pattern: "{controller=Spreadsheet}/{action=Index}/{id?}");
   });
   

3. Declare a POST action handler in the SpreadsheetController controller.

   public class SpreadsheetController : Controller {
       [HttpPost]
       [HttpGet]
       public IActionResult OnPostDocumentRequest() {
           return SpreadsheetRequestProcessor.GetResponse(HttpContext);
       }
   }
   

4. Use this handler in the DocumentRequestHandlerUrl(String) method as follows.

   Razor C#

   @(Html.DevExpress().Spreadsheet("spreadsheet")
       .DocumentRequestHandlerUrl(Url.Action("OnPostDocumentRequest", "Spreadsheet"))
       //...
   )
   

Configure MVC Web Apps

Follow the steps below to add a Spreadsheet to an MVC web page:

1. Create a new controller or open an existing controller (for example, the HomeController.cs file), and add an action that handles document commands as shown below:

   using DevExpress.AspNetCore.Spreadsheet;
   ...
   public class HomeController : Controller
   {
       [HttpPost]
       [HttpGet]
       public IActionResult DxDocRequest() {
           return SpreadsheetRequestProcessor.GetResponse(HttpContext);
       }
       /// ...
   }
   

2. Use the Spreadsheet helper to add a spreadsheet to a Razor file (.cshtml):

   @(Html.DevExpress()
       .Spreadsheet("spreadsheet")
       .DocumentRequestHandlerUrl(Url.Action("DxDocRequest")))