Example of Creating the MetabaseObjectsIconView Component

To execute the example, in the HEAD tag of the HTML page add links to the following JS and CSS files:

In the SCRIPT tag add the following script:

        // Function that will be executed on page loading
        function onLoad() {
            mb = new PP.Mb.Metabase({
                Id: "WAREHOUSE",
                UserCreds: new PP.Mb.UserCreds({
                    UserName: "user",
                    Password: "password"
                })
            });
            //Open repository
            mb.open()
            // Create
            list1 = new PP.Mb.Ui.MetabaseObjectsIconView({
                // Root folder key
                RootKey: 67,
                // Repository, from where data is taken
                Metabase: mb,
                ParentNode: document.getElementById("mtl"),
                // Object height
                ItemHeight: 40,
                // Object width
                ItemWidth: 100,
                // Object list display option - large icons
                IconType: PP.Mb.Ui.NavigatorBox.ObjectListMode.Giant,
                // Object orientation type - horizontal orientation
                Orientation: "Horizontal"
            });
        };

In the BODY tag add the onload attribute and the div element with the mtl identifier:

<body onload="onLoad();">

    <div id = "mtl"></div>

 </body>

After executing the example the HTML page will contain the MetabaseObjectsIconView component that looks as follows:

See also:

MetabaseObjectsIconView