API Reference for Pinboard Events in JavaScript
onActionStart
This event will be triggered at the beginning of every viewer action, including connection, layout and dashboard rendering, popup opening and closing, refreshing, filtering, exporting, and more.
| Name | Type | Access | Description |
|---|---|---|---|
| eventType | get | Will hold the current event type that triggered the event | |
| source | get | This will contain the data related to the current event as like below. 1. data 2. element |
|
| source.element | object | get | Holds the current event site UI element. If there involves no UI element will be returned as null |
| source.data | object | get | Holds the current event data. |
Example
var dashboard = BoldBI.create({
events: {
onActionStart: function (args) {
if (args.eventType === "clearAllFilter") {
// Write a code block to perform any further actions.
}
}
}
});
dashboard.loadPinboard()Event Types
| Event Types | Description |
|---|---|
| renderLayout | This event will trigger when the layout of the dashboard started to render. |
| renderDashboard | This event will trigger when the dashboard started to render. |
| renderWidget | This event will trigger when the widget started to render. |
| resizeDashboard | This event will trigger when we invoke the resize dashboard method or when you resize the browser window. |
| exportDialogOpen | This event will trigger when the export dialog box opens, when you click on the export option in the context menu. |
| exportDialogClose | This event will trigger when the export dialog box closes. |
| maximizeDialogOpen | This event will trigger when the Maximize dialog box opens, when you click on the Maximize icon in the widget header. |
| maximizeDialogClose | This event will trigger when the Maximize dialog closes. |
| filterOverViewOpen | This event will trigger when the filter overview drop-down opens. |
| filterOverViewClose | This event will trigger when the filter overview drop-down closes. |
| clearFilter | This event will trigger when you clear the individual filter in the filter overview. |
| clearAllFilter | This event will trigger when you clear all the filters in the filter overview drop-down. |
| clearWidgetFilter | This event will trigger when you clear the filter in the widget. |
| exporting | This event will trigger when the dashboard exporting gets started. |
| datasourceConfiguration | This event will trigger when the datasource icon is clicked. |
onActionComplete
This event will be triggered once all viewer actions have been completed.
| Name | Type | Access | Description |
|---|---|---|---|
| eventType | get | Will hold the current event type that triggered the event | |
| source | get | This will contain the data related to the current event as below. 1. element 2. data |
|
| source.element | object | get | Holds the current event site UI element. If there involves no UI element will be returned as null |
| source.data | object | get | Holds the current event data. |
Example
var dashboard = BoldBI.create({
events:{
onActionComplete: function (args) {
if (args.eventType === "clearFilter") {
// Write a code block to perform any further actions.
}
}
}
});
dashboard.loadPinboard();Event Types
| Event Types | Description |
|---|---|
| layoutRendered | This event will trigger after the layout rendering is completed. |
| dashboardRendered | This event will trigger after the dashboard rendering is completed. |
| viewDataDialogOpen | This event will trigger when the ViewData dialog box opens, when you click on the ViewData option in the context menu. |
| viewDataDialogClose | This event will trigger when the ViewData dialog box closes. |
| exporting | This event will trigger when the dashboard exporting gets started. |
| exportCompleted | This event will trigger when the dashboard exporting gets completed. |
| clearFilter | This event will trigger when you clear the individual filter in the filter overview and gets completed. |
| clearWidgetFilter | This event will trigger when you clear the filter in the widget and gets completed. |
| Save | This event will trigger once the Publish option is clicked in dashboard designer mode. |
| SaveAs | This event will trigger once the Publish As option is clicked in dashboard designer mode. |
onResize
This event will be triggered when you resize the pinboard.
| Name | Type | Access | Description |
|---|---|---|---|
| args | get | Holds the Dashboard Viewers Object like below. 1. ServerUrl - BoldBI server URL passed to render the dashboard. 2. itemId - Unique id of the BoldBI Dashboard. 3. dashboardName - Unique name of the BoldBI Dashboard. |
Example
var dashboard = BoldBI.create({
events:{
onResize: function (args) {
// Write a code block to operate when you resize the pinboard.
}
}
});
dashboard.loadPinboard();viewer
beforeViewDataRender
This event will be triggered before the viewdata banner icons are rendered.
| Name | Type | Access | Description |
|---|---|---|---|
| type | get | Will holds the current event type that triggered the event | |
| model | get | Holds the dashboard viewer's object. | |
| iconsinformation | array | set | Holds the information about the list of icons to be rendered in the Dashboard. |
| dashboardPath | string | get | Holds the current dashboard path value. |
| cancel | boolean | set | Holds the cancel value of the current operation. |
Example
var dashboard = BoldBI.create({
events:{
viewer:{
beforeViewDataRender: function (args) {
// Write a code block to perform an operation before the dashboard banner icons were rendered
// var icon = $("<div/>", {
// "class": "su su-nav-schedule",
// "data-tooltip": "NewCustomIcon",
// "data-name": "schedule",
// "data-event": true,
// css: {
// "font-size": "15px", "padding": "4px 4px", "margin": "14px 8px", "float": "left",
// "line-height": "20px"
// }
// }).on("click", function () {
// alert("Icon is triggered")
// });
// args.iconsinformation[0].items.push(icon);
}
}
}
});
dashboard.loadPinboard(); pinboard
onLayoutChange
This event will be triggered when you change the layout of the pinboard.
| Name | Type | Access | Description |
|---|---|---|---|
| args | get | Holds the Dashboard Viewers Object like below. 1. ServerUrl - BoldBI server URL passed to render the dashboard. 2. itemId - Unique id of the BoldBI Dashboard. 3. dashboardName - Unique name of the BoldBI Dashboard. |
Example
var dashboard = BoldBI.create({
events:{
pinboard:{
onLayoutChange: function (args) {
// Write a code block to operate when you change the layout of the pinboard.
}
}
}
});
dashboard.loadPinboard();onDrag
This event will be triggered when you perform the drag widget on the pinboard.
| Name | Type | Access | Description |
|---|---|---|---|
| args | get | Holds the Dashboard Viewers Object as follows. 1. ServerUrl - Bold BI Server URL is passed to render the dashboard. 2. itemId - Unique id of the BoldBI Dashboard. 3. dashboardName - Unique name of the BoldBI Dashboard. |
Example
var dashboard = BoldBI.create({
events:{
pinboard:{
onDrag: function (args) {
// Write a code block to operate when you drag the widget from the pinboard.
}
}
}
});
dashboard.loadPinboard();onDrop
This event will be triggered when you drop the widget.
| Name | Type | Access | Description |
|---|---|---|---|
| args | get | Holds the Dashboard Viewers Object as follows. 1. ServerUrl - Bold BI Server URL is passed to render the dashboard. 2. itemId - Unique id of the BoldBI Dashboard. 3. dashboardName - Unique name of the BoldBI Dashboard. |
Example
var dashboard = BoldBI.create({
events:{
pinboard:{
onDrop: function (args) {
// Write a code block to operate when you drop the widget in the pinboard.
}
}
}
});
dashboard.loadPinboard();onUnpin
This event will be triggered when you remove the widget from the pinboard.
| Name | Type | Access | Description |
|---|---|---|---|
| args | get | Holds the Dashboard Viewers Object as follows. 1. ServerUrl - Bold BI Server URL is passed to render the dashboard. 2. itemId - Unique id of the Bold BI Dashboard. 3. dashboardName - Unique name of the Bold BI Dashboard. |
Example
var dashboard = BoldBI.create({
events:{
pinboard:{
onUnpin: function (args) {
// Write a code block to perform an operation click the unpin widget.
}
}
}
});
dashboard.loadPinboard();widget
beforeContextMenuRender
This event will be triggered after clicking the control menu icon from the widget banner.
| Name | Type | Description |
|---|---|---|
| type | Will holds the current event type that triggered the event | |
| model | Holds the Dashboard Viewer's Object. | |
| header | string | Contains the title of the widget. |
| menuItem | array | Contains array value present in the widget control menu. |
| widgetId | string | Holds the id of the widget where the menu icon is clicked. |
| cancel | boolean | Holds the cancel value of the current operation. |
Example
var dashboard = BoldBI.create({
events:{
widget: {
beforeContextMenuRender: function (args) {
// Write a code block to perform an operation after control menu icon from the widget banner is clicked.
}
}
}
});
dashboard.loadPinboard(); onToolbarItemClick
This event will be triggered when an icon from the widget banner is clicked.
| Name | Type | Access | Description |
|---|---|---|---|
| type | get | Will holds the current event type that triggered the event | |
| model | get | Holds the dashboard viewer's object. | |
| target | array | get | Contains the parent element of the selected icon. |
| name | string | get | Contains the name of the icon clicked. |
| dashboardPath | string | get | Holds the current dashboard path value. |
| headertext | string | get | Contains the title of the widget. |
| event | object | get | Returns the current click event information as like below. 1. type - It indicates the type of event, here it is click. 2. currentTarget - It indicates the current DOM element |
| widgetId | string | get | Holds the id of the widget where the menu icon is clicked. |
| dataWidgetId | string | get | Holds the id of the widget where the menu icon is clicked. |
| cancel | boolean | set | Holds the cancel value of the current operation. |
Example
var dashboard = BoldBI.create({
events:{
widget: {
onToolbarItemClick: function (args) {
// Write a code block to perform an operation after an icon from widget banner is clicked
}
}
}
});
dashboard.loadPinboard(); Related pages: Pinboard | Previous: Methods | Next: Token Generation (v13 and below)