Along with the instructor, start creating the Component, and examine its Events and controls.

  1. In the MobSec Web Projects Control Panel, create a new UX Component from the template highlighted below:

(These are all of the SecurityFramework templates.)

  1. Save the Component with file name AddNewUser.
  2. Display the Component in Working Preview.
  3. In Working Preview, click Show/hide notes for this Dialog. The instructor will review these notes.

(For this course, our New Group will be Sales.)

  1. Click the Design tab.
  2. Click Server-side Events.
  3. Click the onDialogInitialize Event. In its script window:
    1. Locate the line that begins e.control.UserRoles.
    2. Change New Users to Sales.
      (The Event will use the websecurity_groups table.)
    3. Save the Component.

  1. Click the dialogValidate Event. Examine these lines in the script window:

    1. The lines that begin dialogValidate handle messages for errors validating security.
    2. The line in green validates values from the controls against the security tables.
  1. Click the afterDialogValidate Event.
    Locate this line in its script window:

This command will save values to the userparms table (once we modify some controls), and execute a Server-side action to save control values to the rest of the websecurity_ tables.

  1. In the left-hand pane, click Controls. Examine the controls in FRAME_1.
    1. The userparms table has fields to map to the FirstName and LastName Controls.
    2. The table has a field named inactive that needs a control:
      1. Above the closing tag of FRAME_1, add a Checkbox control.
      2. Enter the Name Inactive, and the Label Inactive user?
      3. Its Type is Logical, and make its Default value .f..
  2. Save the Component.

Observe as the instructor binds the Component’s controls to the developer- defined userparms security table.

  1. In the left-hand pane, click Data Binding.
  2. In the Data Binding window, click this link:

  1. The Bind UX Controls window appears. Click the Specify Tables button.
  2. The Select Tables window appears.
    1. Delete the RegisteredUsers table.
    2. At the bottom of the window, click the Select button, and choose the connection string secsys, as shown here:

  1. Click the Add Table button. Choose the userparms table.
  2. When you return to the Select Tables window, it should look like this:

The Primary key field(s) is filled in automatically.
Accept the other defaults; click OK.

  1. Take note of the Important Warning that appears, and click OK.
  2. Returning to the Bind UX Controls window, click OK or Cancel (either will suffice in this case).
  3. If a Delete Table Aliases window appears, delete the RegisteredUsers alias, and click OK.
  4. Then, click this link again:

(Doing so refreshes the table values internally.)

  1. In the Bind UX Controls window, click the button.

If you receive any errors indicating that a “Field Type” is not known, click OK through all errors, then click Cancel twice and then click “Refresh table information after editing table schema”.

  1. Bind the FirstName and LastName variables to the fields with the same names.
  2. Bind the Username control to UserName field.
  3. Bind the Inactive control to the Inactive field.
  4. Click OK twice to exit.
  5. Click Server-side Events again.
  6. Click the afterDialogValidate Event, click on the line of code that reads “ExecuteServerSideAction(…)”.
  7. Click the  button, and choose Edit Action from the box that appears.
  8. The   window appears. Click OK.

This recompiles the Action and saves references to the userparms table.

  1. Click OK and Save the Component.
  2. Display the Component in Working Preview, and try using it.

Now you perform the data binding, and complete the Component.