You can use this session to add validation for a specific ViewModel use case, understand why users should log in when working in multiple browser windows, and use a modal dialog to select a related object.
What you will build
Session 4 extends the car-rental example with:
- A ViewModel validation rule for a car registration number.
- A RentalContract class related to a car and a user.
- A Rental Contract ViewModel that displays dates, renter information, and car information.
- Modal actions for choosing the renter and car for a rental contract.
Watch the Session 4 walkthrough while following the steps below.
Validate data in one ViewModel
A ViewModel validation is a rule for one use case. It evaluates an OCL expression in the context of the main ViewModel class and produces an error message when the expression evaluates to false. Attach the rule to one or more ViewModel columns so that the user receives feedback at the relevant input.
Use ViewModel validation when the rule belongs to the screen or workflow. Use a class constraint when the rule must hold for every instance of the class, regardless of which ViewModel edits it. Do not duplicate the same expression in both places; see ViewModel validations and Data validation for the full validation guidance.
Example: require a longer registration number
In the session example, the validation applies to the car registration-number input. The expression requires the value to be longer than five characters:
self.RegistrationNumber.Length > 5For example, ABC12 breaks the rule, while ABC123 fulfils it.
Add and connect a validation rule
- Open the relevant ViewModel in the ViewModel Editor.
- Select Add Validation.
- Create a validation row and enter a rule name.
- Enter an OCL expression that evaluates to true when the value is valid. For the registration-number example, enter
self.RegistrationNumber.Length > 5. - Enter the message that the user should see when the rule is broken, such as
Registration number must contain at least 6 characters. - Right-click the ViewModel column that should show the validation feedback. For this example, right-click the RegistrationNumber column.
- Select Validation rules and select the rule you created.
- Upload the model and test the ViewModel in Turnkey.
When a user enters fewer than six characters, Turnkey displays validation feedback at the connected field. A rule can be connected to more than one column when several inputs need to indicate the same problem.
| Rule type | Use it when | Example |
|---|---|---|
| ViewModel validation | The rule applies to a particular ViewModel use case or screen. | Show an error on the RegistrationNumber input while editing a car in this ViewModel. |
| Class constraint | The rule must be obeyed by every instance of a class. | A business rule that must remain true regardless of where a car is edited. |
Work in separate user contexts
The session demonstrates what happens when the same Turnkey application is open in more than one browser window.
Before a user logs in, the windows operate in the same anonymous context (shown in the demonstration as a null user). Changes made in one window can be reflected in the other window. The demonstration also shows that this replication can take up to about eight seconds.
Logging in identifies who is working with the application. After you log in, changes in another browser context do not appear as unsaved edits in your current window. Save operations determine which persisted values are shown; if conflicting work is cancelled, the saved information is retained.
Test the behavior
- Open the application in two separate browser windows or browser contexts.
- In one window, edit a car value or image and observe the other window while using the anonymous context.
- Register and log in to the application.
- Edit a value in one logged-in context without saving it.
- Verify that the other context does not receive that unsaved edit.
- Save in one context, then refresh or revisit the data in the other context to work from the persisted value.
Make login part of the normal workflow when different users work with the same information. The next session covers using the logged-in user and controlling action access: Turnkey session 5: How to Access the Logged in User. AccessGroups.
Model a rental contract
The session adds a rental contract that connects a car with its renter.
- Add a class named RentalContract.
- Add StartDate and EndDate attributes.
- Create an association so that a car can have many rental contracts.
- Create an association so that a user can have many rental contracts. Name the RentalContract end Renter.
The example uses the Sys User class supplied by the ASP.NET Identity package as the renter type.
Create the Rental Contract ViewModel
Create a ViewModel whose main ViewModel class is RentalContract. Add the information needed to create and inspect one rental contract:
| ViewModel content | Presentation in the session | Purpose |
|---|---|---|
| StartDate | Date and time picker | Enter the rental start date. |
| EndDate | Date and time picker | Enter the rental end date. |
| Renter.UserName | Follow the association to the Sys User user name; make the column static. | Display the selected renter without allowing direct editing. |
| Car.RegistrationNumber | Follow the association to the car registration number; make the column static. | Display the selected car without allowing direct editing. |
A static column is used here because the renter and car are selected through actions rather than typed directly into the displayed fields.
Open and create rental contracts
Add actions for the two entry points demonstrated in the session:
- Add a class action that shows the Rental Contract ViewModel when a rental contract is available.
- Add a global action named Create rental contract to start a new rental contract.
Global actions are application-level entry points. Class actions act when the relevant class instance is available.
A modal dialog opens another ViewModel and requires the user to complete or cancel that interaction before returning to the original ViewModel. In this example, modal dialogs let the user choose a renter and a car rather than edit the associations as text.
- Add a ViewModel action for picking the renter.
- Add a ViewModel action for picking the car.
- Configure the pick-car action to open the AllCars ViewModel as a modal dialog.
- Define the modal dialog's On OK expression so that it assigns the selected car to the current rental contract's car association.
- Upload the model.
- Run Create rental contract, enter the dates, select Pick car, choose a car, and select OK.
- Confirm that the selected car's registration number is shown as the static car value on the rental contract.
The important result is the association assignment: the car selected in the modal ViewModel becomes the car for the current rental contract. Apply the same pattern to select a renter.