Embedding Powerful UI with UserControlHost PageType in Business Central

With the release of Business Central 2025 Wave 1, new page type UserControlHost is introduced which enables embedding custom JavaScript-based controls into the Business Central web client.

🔍 What is UserControlHost?

The UserControlHost page type allows you to embed custom client-side controls—typically written in JavaScript—inside the Business Central web client using the ControlAddIn object.These controls are built with web technologies—JavaScript, HTML, and CSS—and provide flexibility far beyond standard AL UI elements.

Think of UserControlHost as a “wrapper” that renders client-side controls defined via the ControlAddIn object.

You might consider using UserControlHost for:

  • Advanced data visualizations (charts, graphs, maps)
  • Dynamic dashboards or interactive UI widgets

🧱 How to use

To use the UserControlHost, you need two key components:

  1. A Control Add-In (ControlAddIn)
  2. A Page with PageType = UserControlHost
  1. Create the ControlAddIn
controladdin "MyWave2025Control"
{
    Scripts="scripts/chart.js", 'scripts/mycontrol.js';
    StartupScript="scripts/init.js";
    StyleSheets="styles/mycontrol.css";

    RequestedHeight = 400;
    RequestedWidth = 600;

    AutoAdjustHeight = true;
    AutoAdjustWidth = true;

    Events = OnItemSelected(text);
    Methods = LoadData(data: Text);
}

2) Create the UserControlHost Page

page 50200 "Dashboard Host"
{
    PageType = UserControlHost;
    ApplicationArea = All;

    layout
    {
        area(content)
        {
            usercontrol(MyCustomChart; "MyWave2025Control")
            {
                ApplicationArea = All;
            }
        }
    }

    trigger OnOpenPage()
    begin
        CurrPage.MyCustomChart.LoadData('{"region": "Thailand"}');
    end;

    trigger OnControlReady()
    begin
        Message('Custom Control is ready!');
    end;
}

The UserControlHost page type, especially with Wave 1 2025 enhancements, is the go-to choice for scenarios where traditional AL UI just won’t cut it. Whether you’re building modern dashboards, embedding custom charts, or creating interactive widgets

Original Post https://ammolhsaallvi.blog/2025/04/11/embedding-powerful-ui-with-usercontrolhost-pagetype-in-business-central/

0 Votes: 0 Upvotes, 0 Downvotes (0 Points)

Leave a reply

Join Us
  • X Network2.1K
  • LinkedIn3.8k
  • Bluesky0.5K
Support The Site
Events
April 2025
MTWTFSS
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30     
« Mar   May »
Follow
Sign In/Sign Up Sidebar Search
Popular Now
Loading

Signing-in 3 seconds...

Signing-up 3 seconds...