K2BTools Tutorial - Exercise 1.4: Edit Mode

As we saw in runtime, every time the user performs an operation (insert, update or delete) an EntityManager interface is displayed and the operation is performed using the EntityManager. This interaction can be modified by the developer using the "Edit Mode" property.

"Edit Mode" is a property included in WorkWith and SubWorkWith nodes that allows the developer to choose a different behaviour when editing instances inside that interface. The values available for this property are "Standard" (default mode), "Master-Detail", "Popup" and "In Line".

Edit Mode - Standard

In this mode, an EntityManager interface is created, and that interface is called to Insert, Display, Update, or Delete records. The Entity Manager is Mandatory: If the Entity Manager is not generated, the "Standard" mode cannot be generated.

Since this is the mode we were using in the last exercise, we are not going to apply it now.

Edit Mode - PopUp

In this mode, the WorkWith interface is equal to the Work With interface in the "Standard" mode. The main difference is that in this case, when executing the "Insert", "Display", "Update" and "Delete" actions the transaction is opened in a Popup screen instead of the EntityManager.

  1. Open the EntityServices instance for the Product transaction.
  2. Select its "WorkWith" node.
  3. Change the "Edit Mode" property to "PopUp".
    EdtModePopUp
    Edit Mode Pop Up

  4. Build and run.
  5. Insert, update and delete a product.

Edit Mode - Master Detail

In this mode, the WorkWith screen is divided in two areas. The first one contains the controls found in the "Standard" Work With interface, while the second one contains a Web Component that will contain the transaction associated with the Work With. The Web Component is empty when the user enters the interface, and a "Select Record" message is shown. The Insert, Display, Update, and Delete actions trigger an update on the Web Component, to show the transaction in the correct mode.

  1. Open the EntityServices instance associated with the Product transaction.
  2. Right click on the "WorkWith" node and select "Change WorkWith"option.
    ChangeWorkWith
    Change Work With

  3. Select "Master Detail Grid" template and click on "Finish".
    MasterDetailGrid
    Master Detail Grid

    .
  4. Build and run.
  5. In runtime:
    1. Select a product and see how the Web Component shows the selected product in display mode.
    2. Click on "More Information..." to go the EntityMangaer for that product.
    3. Add a new product
    4. After the insert is completed, component should display the product using the transaction's display mode. See how in this mode the update and delete actions are available
      UpdateAndDeleteTwoPane1
      Update and Delete in Master-Detail component

    5. Update the recently added product.
    6. Delete that product.

Edit Mode - In Line

In this mode, the WorkWith and SubWorkWith interfaces use their main grid to display, insert, and update information. When the insert action is executed a new line appears in the grid. When the update action is executed, non-readonly fields are shown as enabled so that the user can change their values and save them. When the delete action is executed, the item is deleted without navigating to the transaction.

  1. Open the EntityServices instance associated with the Product transaction.
  2. Right click on the "WorkWith" node and select "Change WorkWith"option.
    ChangeWorkWith
    Change Work With

  3. Select "Inline Edit Grid" template.
    InlineEditGrid
    Inline Edit Grid

  4. Apply the pattern and click on finish.
  5. Run
  6. Insert, update and delete a product.