How to Create a Custom View of the Dictionary Element Properties Dialog Box?

To use a custom view of the Dictionary Element Properties dialog box:

  1. Create a custom dialog box view. The detailed description is given below.

  2. Open the Card tab on the Description tab.

  3. Select the created unit in the Assembly, Unit or Form drop-down list.

  4. Select a function in the Function drop-down list.

  5. Specify JS-function in the JS-Function box.

  6. Save dictionary changes.

Example of Creating a Custom View of the Dictionary Element Properties Dialog Box in the Desktop Application

To create a custom view of the Dictionary Element Properties dialog box in the desktop application, use the development environment.

The card view is determined by the created form. The dialog box view is replaced as a result of executing the function specified in the unit linked with the form.

To create a custom view of the dialog box, create a form with the UIRDS_CHANGE identifier. Place buttons with the OK and Cancel identifiers on the form, the EditBox components with the FieldName and FieldEmail identifiers, and the Label  components with the Name and Email identifiers. Set global variables Elements: IRdsDictionaryElements, ElemKey: Integer, NewElem: Boolean, Key: Integer, Data: IRdsDictionaryElementData, DataCopy: IRdsDictionaryElementData. Add the Public access modifier for the UIRDS_CHANGE form class and the Key global variable.

Add links to the Rds, Ui system assemblies.

Add the OnClick event handler for the OK button with the following code:

Sub OkOnClick(Sender: Object; Args: IMouseEventArgs);
Begin
    If NewElem = true Then
        Data := Elements.CreateElementData;
        Data.Value(1) := FieldName.Text;
        Data.Value(4) := FieldEmail.Text;
        Key := Elements.Insert(ElemKey, Data);
    Else
        Data.Value(1) := FieldName.Text;
        Data.Value(4) := FieldEmail.Text;
        Elements.Update(ElemKey, Data);
        key := ElemKey;
    End If;
    self.Close;
End Sub OkOnClick;

Add the OnClick event handler for the Cancel button with the following code:

Sub CancelOnClick(Sender: Object; Args: IMouseEventArgs);
Begin
    self.ModalResult := FormModalResult.Cancel;
    self.Close;
End Sub CancelOnClick;

Add the OnCommand event handler for the UIRDS_CHANGE form with the following code:

Sub UIRDS_CHANGEFormOnCommand(Sender: Object; Args: ICommandEventArgs);
Begin
    If Args.Command = "sendElements" Then
       Elements := (Args.Argument As Array)[0];
       ElemKey := (Args.Argument As Array)[1];
       NewElem := (Args.Argument As Array)[2];
       DataCopy := (Args.Argument As Array)[3];
    End If;
    If NewElem = False Then
       Data := Elements.Data(ElemKey);
       FieldName.Text := Data.Value(1);
       FieldEmail.Text := Data.Value(4);
       Else
       If Not IsNull(DataCopy.Value(1)) Then
       FieldName.Text := DataCopy.Value(1);
       FieldEmail.Text := DataCopy.Value(4);
       Ok.Enabled := True;
       Else
       Ok.Enabled := False;
       End If;
    End If;
End Sub UIRDS_CHANGEFormOnCommand;

Add the OnChange event handler for the FieldName component with the following code:

Sub FieldNameOnChange(Sender: Object; Args: IEventArgs);
Begin
    Ok.Enabled := FieldName.Text = "" ? False : True;
End Sub FieldNameOnChange;

To replace the predefined dialog box view with the created one in the UIRDS_CHANGE form, create a unit.

Add links to the Forms, Rds system assemblies.

Bind the unit with the UIRDS_CHANGE form by adding a link to the form on the Repository Assemblies tab.

Add a function with the Public access modifier with the following code:

Public Function AddOrEditElement(ParentWnd: IWin32Window; Elements: IRdsDictionaryElements; ElemKey: Integer; NewElem: Boolean; ReadOnly: Boolean; InitData: IRdsDictionaryElementData): Integer;
Var
    f: UiRds_ChangeForm;
    ar: array;
Begin
    f := New UiRds_ChangeForm.CreateForm(ParentWnd);
    ar := New Variant[4];
    ar[0] := Elements;
    ar[1] := ElemKey;
    ar[2] := NewElem;
    ar[3] := InitData;
    f.SendCommand("sendElements", ar);
    f.ShowModal;
    If f.ModalResult = FormModalResult.Cancel Then
        Return - 1;
    Else
        Return f.Key;
    End If;
    
End Function AddOrEditElement;

Example of Creating a Custom Element Card in the Web Application

Enter JS-function name on the Card tab in the desktop application. The function can be added as a single file or embedded into the main tool file.

To embed the JS-function into HTML code of the rds.html main file located in the App folder with the installed web application, add the <script> tag with JS-function text to the <head> tag. For example:

<script type="text/javascript">
function AddOrEditElement(tree, operation, itemKey, parentKey, isReadOnly)
{
var source = tree.getSource();
var ItemKey = "35";
alert(operation);
if (operation == PP.Rds.ElementOperation.Insert && itemKey == null)
{
var Item = new PP.Rds.DItem({
    AttrValues: [, "Added element", parentKey,, "@mail.ru"], // Attribute values
Owner: source
});
tree.addItem(parentKey, Item);
}
if (operation == PP.Rds.ElementOperation.Insert && itemKey != null)
{
var Item = new PP.Rds.DItem({
    AttrValues: [, "Copied element", parentKey,, "@fsight.ru"], // Attribute values
Owner: source
});
tree.addItem(parentKey, Item);
}
if (operation == PP.Rds.ElementOperation.Update && itemKey != null)
{
var Item = new PP.Rds.DItem({
    AttrValues: [, "Edited element",,, "@yandex.ru"], // Attribute values
Owner: source
});
tree.editItem(itemKey, Item);
}
};
</script>

Create a JS-file with function code to add a JS-function as a single file. Add a link to the created JS-file to the <head> tag. For example, if JS-file and main tool file are located in the same folder, the link will look as follows:

<script src="Func.js" type="text/javascript"></script>

See also:

Questions and Answers