Example of Creating the DictionaryBox Component

Object properties:

Name: Time units.
Identifier: TIME_UNITS.
Key: 8093.

NOTE. The key is created automatically on creating an object and cannot be edited. This key is used to open a table MDM dictionary in the example code.

Along with predefined dictionary attributes, add a custom attributes:

Identifier	Name	Data type	Multiple values	Hidden	Comments
UNIT_VALUE	Value	Double	No	No	No
DESCRIPTION	Description	String	No	No	No
UNITS_SYSTEM	Systems of measures	Integer	Yes	No	Linked to the System of Units dictionary by the Name attribute
UNITS_SYSTEM_DESCRIPTION	Description of measures system	String	No	Yes	Borrowed attribute. It is linked to the Description attribute in the System of Units dictionary

In basic dictionary settings select the checkboxes:

Elements can change in time.
Translate dictionary into other languages.
Elements have discretionary access permissions.
Elements have hidden attribute.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>RdsBox</title>
    <link href="../build/PP.css" rel="stylesheet" type="text/css" />
    <link href="../build/PP.Metabase.css" rel="stylesheet" type="text/css" />
    <link href="../build/PP.Dictionaries.css" rel="stylesheet" type="text/css" />
    <script src="../build/PP.js" type="text/javascript"></script>
    <script src="../build/PP.Metabase.js" type="text/javascript"></script>
    <script src="../build/PP.Dictionaries.js" type="text/javascript"></script>
 
    <script type="text/javascript">
        var dictionaryKey = 8093; // Key of table MDM dictionary Time Units
        function Ready() {
            PP.ImagePath = "../build/img/";
            PP.ScriptPath = "../build/";
            PP.CSSPath = "../build/";
            PP.resourceManager.setRootResourcesFolder("../resources/");
            PP.resourceManager.setResourceList(['PP', 'Metabase', 'Dictionaries']);
            PP.setCurrentCulture(PP.Cultures.ru);
            // Create a repository connection
            metabase = new PP.Mb.Metabase({
                // Set PP.SOM web service URL in the format:
                // <http://<ServerName | IP-address>[:<Port>][/<VirtualCatalog>]/axis2/services/PP.SOM.Som>
                PPServiceUrl: "http://localhost/FPBI_App_v9.x/axis2/services/PP.SOM.Som",
                // Specify repository identifier and user credentials
                Id: "REPOSITORY",
                UserCreds: {
                    UserName: "user",
                    Password: "password"
                }
            });
            // Open repository connection
            metabase.Error.add(function (sender, args) {
                alert(args.ResponseText);
            });
            metabase.Opened.add(function (sender, args) {
                openDictionaryBox();
            });
            metabase.open();
        }
        // Open table MDM dictionary with the specified key
        function openDictionaryBox() {
            service = new PP.Dictionaries.RdsService({
                Metabase: metabase,
                RdsOpened: function (sender, args) {
                    console.log("Key of opened dictionary: %s", args.Dictionary.getKey());
                    console.log("Identifier of opened dictionary: %s", args.Dictionary.getId());
                },
                RdsClosed: function (sender, args) {
                    console.log("Name of closed dictionary: %s", args.Dictionary.getName());
                }
            });
            source = service.openRds(dictionaryKey, null, true);
            rdsBox = new PP.Dictionaries.Ui.RdsBox({
                Source: source,
                ParentNode: "rdsBox",
                ImagePath: PP.ImagePath,
                Width: 800,
                Height: 400,
                Open: function (sender, args) {
                    source = service.openRds(dictionaryKey, null, true);
                    rdsBox.setSource(source);
                },
                Close: function (sender, args) {
                    // Remove dictionary from container
                    rdsBox.setSource(null);
                    // Close dictionary
                    service.closeRds(source, function (sender, args) {
                        console.log("Key of closed dictionary: %s",
                        args.Args.Dictionary.getKey())
                    });
                    rdsBox.refreshAll();
                }
            });
        }
    </script>
</head>
<body onload="Ready()">
    <div id="rdsBox" style="border: 1px #C3C3C3 solid; width: 805px"></div>
</body>
</html>

NOTE. To execute custom scripts for the container that stores MDM dictionary, including the examples given on the pages that contain descriptions of properties, methods and events of this component and its constituent parts, place the code either in the Ready function or in the browser console.

After executing the example the HTML page contains the RdsBox component that displays the Time Units table MDM dictionary:

The RdsService.RdsClosed and DictionaryBox.Close events are triggered in this case, after which the browser console displays key and name of the closed dictionary: