Category / Section
How to add ComboBoxButton custom widget in a dashboard?
Published:
Follow the below steps to publish the custom
widget into the Bold BI application and use it.
Step 2: Publish
the custom widget to the Bold BI application by following the documentation link.
Step 3: Once
you publish the custom widget, the ComboBoxButton custom
widget will appear under the Miscellaneous section of the designer panel as in
the following image.
Step 4: Drag
and drop the widget and configure the data. The DropDownControl custom
widget will render as in the following image.
Improvement
in the ComboBoxButton Custom Widget
Add new improvements such as improving the UI of the ComboBoxButton
Custom widget by making changes in the sourcefile.js file.
To debug and make changes in the custom widget, follow
these steps:
- Unpack the ComboBoxButton custom widget (ComboBoxButton .bicw) by following the steps in the mentioned link.
- Add the debugger to the sourcefile.js file's init() method. Also, add the needed changes in the sourcefile.js file.
- Publish the custom widget by following the steps in this link.
- Now, open the new dashboard in the Bold BI designer.
- Open the Developer Tools in the Browser.
- Drag and drop the ComboBoxButton Custom Widget in the Designer.
- Now, the debugger will trigger.
Also, the ComboBoxButton Custom Widget is
developed using the syncfusion MultiSelect component. For any new
options, check the available API in the UG link.
Methods and use cases in the ComboBoxButton source file.
The following table explains the use case of the methods
available in sourcefile.js.
|
Methods
|
Use case
|
|
init()
|
This method will
trigger when the ComboBoxButton custom widget is dragged and dropped in the
designer or initialized in the viewer.
|
|
update()
|
This method will
trigger when the widget is resized, data is configured in the widget, and
when the changes are made in the property panel.
|
Related Links:
How to create a new custom widget
SK
