JsBlock.getDataBox

Syntax

getDataBox();

Description

The getDataBox method returns data area of the report contained in dashboard block.

Comments

To add a report to dashboard, click the Reports button on the Home ribbon tab and select report type. Determine report data source on the appropriate side panel tab.

Example

To execute the example, make sure that the repository contains a dashboard with the 88665 key.

Create an HTML page with the code that implements repository connection, dashboard opening using the KapBox constructor and creates the Show/Hide Block Data Area checkbox to show or hide report working area contained in the block.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>JsBlock.getDataBox</title>
    <script src="build/PP.js" type="text/javascript"></script>
    <script src="build/PP.Metabase.js" type="text/javascript"></script>
    <script src="build/PP.App.js" type="text/javascript"></script>
    <script src="build/PP.Express.js" type="text/javascript"></script>
    <script src="resources/Kap.resources.ru.js" type="text/javascript"></script>
    <script src="dashboard/dashboard.nocache.js" type="text/javascript"></script>
    <link href="build/PP.css" rel="stylesheet" type="text/css" />
    <link href="build/PP.App.css" rel="stylesheet" type="text/css" />
    <link href="build/PP.Metabase.css" rel="stylesheet" type="text/css" />
 
    <script type="text/javascript">
        // Set PP.SOM service URL as follows:
        // <http://<ServerName | IP-address>[:<Port>][/<VirtualCatalog>]/axis2/services/PP.SOM.Som>
        var serviceUrl = "http://localhost/FPBI_App_v10.x/axis2/services/PP.SOM.Som";
        var exportUrl = "http://localhost/FPBI_App_v10.xx64/axis2/services/PP.SOM.Som";
        var importUrl = "http://localhost/FPBI_App_v10.xx64/axis2/services/PP.SOM.Som";
        // Create a function to open dashboard and get access to block export
        function OpenDashBoard(connId) {
            metabase = new PP.Mb.Metabase({
                Id: "Metabase",
                PPServiceUrl: serviceUrl,
                ExportUrl: exportUrl,
                ImportUrl: importUrl,
                ConnectionOdId: { id: connId }
            });
            kapBox = new Kap.KapBox({
                Metabase: metabase, // repository, to which connection is established
                ParentNode: "DashboardBox", // DOM node, to which the KapBox component will be moved
                ImagePath: "../build/img/", // path to images folder
                ResourcesPath: "../resources/", // path to resources folder
                Key: 88665, // dashboard key
                BlockFocused: kapBlockFocused // block selection event handler
            });
            dataBoxCheckBox = new PP.Ui.CheckBox({
                ParentNode: "checkBox",
                Content: "Show/hide block data",
                CheckedChanged: function () {
                    if (dataBoxCheckBox.getCheckedState() == true) {
                        currentBlock.getDataBox().show();
                    }
                    else
                        currentBlock.getDataBox().hide();
                }
            });
        }
        function kapBlockFocused(sender, args) {
            currentBlock = args.Block;
            console.log(currentBlock)
        };
        // Create a function for repository connection
        function onModuleInit() {
            if (PP.App.isMetabaseOpened()) {
                OpenDashBoard(PP.App.getConnectionId());
            } else {
                // Test entry point for autonomous startup of the KapBox component
                var metabaseLogin = new PP.Mb.Metabase({
                    PPServiceUrl: serviceUrl,
                    Id: "Repository",
                    UserCreds: {
                        UserName: "user",
                        Password: "password"
                    }
                });
                metabaseLogin.Error.add(function (sender, args) {
                    alert(args.ResponseText);
                });
                metabaseLogin.open(function (sender, args) {
                    // Remember opened repository if page reloads
                    var connectionId = metabaseLogin.getConnectionId();
                    PP.App.setStorage("ConnectionId", connectionId);
                    PP.App.setStorage("ConnectOdId", { id: connectionId });
                    PP.App.setStorage("IsMbOpened", true);
                    OpenDashBoard(connectionId);
                });
            }
        }
    </script>
</head>
<body style="height: 100%;">
    <div id="DashboardBox" style="width: 100%; height: 100%;"></div>
    <div id="checkBox"></div>
</body>
</html>

After executing the example select the dashboard block and select or deselect the Show/Hide Block Data Area checkbox. The working area of the report contained in the selected block is shown or hidden.

See also:

JsBlock