Improving the User Experience

Verify that a value help is offered for the Currency field on the Object Page. Examine where and how this value help is defined.

1. Launch the preview of the OData UI service.

   1. Proceed as you have done in previous exercises.

2. Open the Object Page for a flight in edit mode.

   1. Proceed as you have done in previous exercises.

3. Verify that a value help is available for the Currency field.

   1. Open the value help for the Currency field displayed for the flight price.

4. Return to the development environment and explore the definition of the value help.

Exclude the standard operations create and delete, and set the PlaneTypeID field to read-only .

1. In the behavior projection for your service, disable the standard operations create and delete.

   1. Open the behavior projection ZC_##FLIGHT (where ## is your group number).

   2. Add comment markers in front of the statements use create; and use delete;.

      To add the comment markers, proceed as usual: select the code rows you want to comment and press Ctrl + <.

      Your code should then look like this:

      Code Snippet

      Copy codeSwitch to dark mode

      123
      //  use create;
      use update;
      //  use delete;

2. In the behavior projection of your business object, set the PlaneTypeID field to read-only.

   1. In the behavior projection, add the following code:

      Code Snippet

      Copy codeSwitch to dark mode

      1
      field ( readonly ) PlaneTypeID;

      Note

      The precise position of the statement is not important. We suggest that you place it before the use... statements.

3. Activate the behavior projection.

   1. Press Ctrl + F3 to activate the behavior projection.

Hide the administrative fields from the UI. Make sure only CarrierID and ConnectionID are displayed as selection fields on the report list page. Change the field sequence on the Object Page so that PlaneTypeID is displayed before Price.

1. Edit the metadata extension of the projection view ZC_##Flight. Remove all UI annotations for the fields LocalCreatedBy, LocalCreatedAt, LocalLastChangedBy, LocalLastChangedAt, and LastChangedAt and replace them with @UI.hidden: true.

   1. Open the metadata extension ZC_##FLIGHT, where ## is your group number.

   2. Adjust the code as follows:

      Code Snippet

      Copy codeSwitch to dark mode

      1234567891011121314
      @UI.hidden: true
      LocalCreatedBy;
        
      @UI.hidden: true
      LocalCreatedAt;
        
      @UI.hidden: true
      LocalLastChangedBy;
        
      @UI.hidden: true
      LocalLastChangedAt;
        
      @UI.hidden: true
      LastChangedAt;

2. Remove the @UI.selectionField annotation for all elements except for the elements CarrierID and ConnectionID.

   1. Adjust the code as follows:

      Code Snippet

      Copy codeSwitch to dark mode

      1234567891011121314151617181920212223
      @UI.identification: [ {
        position: 30
      } ]
      @UI.lineItem: [ {
        position: 30
      } ]
      FlightDate;
        
      @UI.identification: [ {
        position: 40
      } ]
      @UI.lineItem: [ {
        position: 40
      } ]
      Price;
        
      @UI.identification: [ {
        position: 50
      } ]
      @UI.lineItem: [ {
        position: 50
      } ]
      PlaneTypeID;

3. Change the position of the PlaneTypeID field on the Object Page. Place it between FlightDate and Price.

   Hint

   The position on the Object Page is specified with annotation @UI.identification.

   1. Change the value of annotation @UI.identification: [ { position: } ] for the PlaneTypeID element. Choose a value that lies between the values for the elements FlightDate and Price.

   2. Adjust the code as follows:

      Code Snippet

      Copy codeSwitch to dark mode

      1234567
      @UI.identification: [ {
        position: 35
      } ]
      @UI.lineItem: [ {
        position: 50
      } ]
      PlaneTypeID;

4. Activate the metadata extension.

   1. Press Ctrl + F3 to activate the metadata extension.

Restart the preview of the OData UI service and verify the changes to the user interface.

1. Restart the preview of the OData UI service.

   1. Close the browser window or browser tab that contains the preview.

   2. Open the ZUI_##FLIGHT_O4 Service Binding. In the Entity Set and Association list on the right-hand side, first choose the Flight entry and then choose Preview....

2. On the Report List Page, verify that the buttons Create and Delete have disappeared.

   1. Proceed as you have done in previous exercises.

3. Make sure that no more administrative fields are displayed on the Report List Page.

   1. Proceed as you have done in previous exercises.

4. Verify that - apart from the Editing Status field - only two selection fields are visible at the top of the Report List Page. Test their functionality.

   Hint

   Be aware that the selection fields support the entry of multiple values and ranges.

   1. Enter a value in the selection field Airline ID (for example: LH) and choose Go.

   2. Repeat with other values.

5. For any data set, navigate to the Object Page. Verify that the Delete button has disappeared.

   1. Proceed as you have done in previous exercises.

6. Make sure that no more administrative fields are displayed on the Object Page.

   1. Proceed as you have done in previous exercises.

7. Verify that the Plane Type field is displayed after the Flight Date field and before the Flight Price field.

   1. Proceed as you have done in previous exercises.

8. Switch to edit mode and verify that the value of the Plane Type field cannot be changed.

   1. Proceed as you have done in previous exercises.