Flexmonster Software License Agreement (“Agreement”) has been revised and is effective as of January 8, 2025.
The following modifications were made:
The modified version of Agreement is available here.
Downloading, installing, and/or continuing to use Flexmonster Software after January 8, 2025, constitutes Licensee’s acceptance of the terms and conditions of the modified version of Agreement. If Licensee does not agree to any of these terms and conditions, they must cease using Flexmonster Software and must not download, install, use, access, or continue to access Flexmonster Software. By continuing to use Flexmonster Software or renewing the license or maintenance after the effective date of these modifications to Agreement, Licensee accepts and agrees to be bound by the terms and conditions of the modified Agreement.
Some of Flexmonster's methods and events are not supported in Blazor out of the box (see the list of such methods and events). However, you can use JavaScript to access them.
To demonstrate this approach, let’s customize the Toolbar using JavaScript:
Step 1. In your project, go to the wwwroot/index.html
file and create an empty <script>
section there:
<body>
<app>Loading...</app>
<script src="_framework/blazor.webassembly.js"></script>
<script>
</script>
</body>
This section will contain your JavaScript code for Flexmonster.
Step 2. Inside the window object, create a JavaScript function and pass a Flexmonster instance to it. This instance can be used to access the Flexmonster API. For example:
<body>
<app>Loading...</app>
<script src="_framework/blazor.webassembly.js"></script>
<script>
/* The window.customizeToolbar function subscribes
Flexmonster to the beforetoolbarcreated event
*/
window.customizeToolbar = (pivot) => {
pivot.on("beforetoolbarcreated", customizeToolbarHandler);
}
function customizeToolbarHandler(toolbar) {
// Get all tabs
let tabs = toolbar.getTabs();
toolbar.getTabs = function () {
// Remove the Connect tab using its id
tabs = tabs.filter(tab => tab.id != "fm-tab-connect");
return tabs;
}
}
</script>
</body>
Step 3. Open the file with Flexmonster (e.g., Pivot.razor
) and specify your JavaScript function (e.g., customizeToolbar
) in the FlexmonsterComponent
’s JavaScriptHandler
parameter:
@page "/"
<h3>Pivot</h3>
<FlexmonsterComponent Report="@report"
Toolbar="true"
Width="100%"
Height="600"
JavaScriptHandler="customizeToolbar"
/>
The window.customizeToolbar
function will be called after the Flexmonster instance is created. As a result, your customization will be applied to Flexmonster.