ActiveReports 17 .NET Edition
Developers / Create Applications / Blazor Web Designer Application / Blazor Web Assembly
In This Topic
    Blazor Web Assembly
    In This Topic

    This topic describes how to add the Blazor Designer component to your Blazor Web Assembly Application. This project uses the Report Server.

    1. Open Microsoft Visual Studio 2022.
    2. Create a new project and select the Blazor Server App Empty template.
    3. Type a name for your project and click Create.
    4. Add the GrapeCity.ActiveReports.Blazor.Designer NuGet package.
    5. Add the Blazor Web Designer component to 'Pages/Index.razor'.
      Pages/Index.razor
      Copy Code
      @page "/"
      @using GrapeCity.ActiveReports.Blazor.Designer;
      @inject IJSRuntime JSRuntime
      <div style="height:100vh;width:100%"
          <ReportDesigner @ref="_designer" Server="@_server" Document="@_document" />
      </div>
      @code {
          private ReportDesigner _designer;
          private Server _server = new Server()
          {
              Url = "http://localhost:5098"
          };
          private Document _document = new Document()
              {
                  Id = "List.rdlx",
                  Type = SupportedDocumentType.cpl
              };
      }
      
    6. Run the Report Server.
    7. Build and run the application.