Tersus: Demo Stage 5 – Status: Adding item statuses

Demo Stage 5 – Status: Adding item statusesDate: Oct 17, 2023Adding a FieldIt can be helpful to assign a status to each item in the list. This way, when you walk in the supermarket, you can mark the items you have already bought.Adding a field is easy, using the 'Table Wizard':

In '<Desktop View>', right click on 'Items' and select Apply Table Wizard.

Add a field 'Status' (Text)

Press 'Finish'

The wizard will update your model with the additional field in all relevant places. If you now save your model and restart the appliaction, you will be able to update the status of any item you choose.Adding a 'Got It' ButtonUpdating an item's status requires the selection of its row in the table, pressing the 'Update' button, entering the new status, and pressing 'Save'.Walking in the supermarket with your iPhone, you may prefer a one-click method to mark an item you buy. To support this, we can add a 'Got It' button to mark an item as bought:Modeling the button in the top rowThe straightforward way is to create the 'Got It' button in the 'Action Header Group' of the row above the item table (the group with the existing buttons 'New', 'Update' and 'Delete'):

Drag a 'Button' from the 'Display' section of the palette. Name it 'Got It'.

Add 'with-minimal-margins' to the button's html.styleClass propery (in the 'Properties' tab below the model). All other buttons in 'Action Header Group' have this style class.

Model the button similar to the way the 'Save' button is modeled inside the footer of the 'Update' dialog (see comments below the screenshot):

Items: Right click, select Add Ancestor Reference, and select the

'Items' element.
Convert Row to Record: Drag from the model repository from the package 'ShoppingList/Desktop/Items/Wizard/Transformations'.
Create Parameters, Sve Update, Refresh Page: Copy from the 'Save' button inside the footer of the 'Update' dialog (go to 'Save/<On Click>', select the 3 elements and the flows between them, and select Copy; then return to 'Got It' and select Paste (Reuse)).
√: Create a text constant with the value "√".If you now restart the application, you will only need to select a row and press 'Got It', and its status will be changed to √.Download Model: Stage 5, Interim Model (version 2.4.1)Reusing in each item rowTo make 'Got It' a truely one-click-button, we would like to save the need to select a row before pressing the button.This can be achieved by putting a 'Got It' button in each table row – clicking the button will change the status of its row.Modeling is trivial:

In the editor, select the 'Got It' button, zoom into <On Click>, right-click 'Mark as Got', and select Copy.

Inside

'Items', zoom into 'Table Row/Status Td/Status', and add to it a new button 'Got It'.

Zoom into 'Got It/<On Click>', right-click and select Paste (Reuse).

Right-click again in 'Got It/<On Click>', select Add Ancestor Reference, and select the 'Body Row' element. Create a link from it to th etrigger of 'Mark as Got'.

Making the button invisible if an item is already boughtOnce an item is marked as bought (√), we no longer need the 'Got It' button in its row.Actually, if we only display the buttons for the other items, we will make it easier to see which items we still need to look for on the shelves.We can model this by displaying the 'Got It' button only if the item's status is different from '√':

Under 'Body Row/Status Td', open the model of 'Got It' and add a 'Boolean' element '<Visible>'.

Open the 'Convert Record to Row' model (from the package 'ShoppingList/Desktop/Items/Wizard/Transformations').

Add to 'Convert Record to Row' an action 'Show or Hide Row Button' that sets the value of the '<Visible>' element of the 'Got It' button based on the item's status:

Here is a possible way to model 'Show or Hide Row Button' (note its trigger 'Status' is optional, because 'Status' may be missing, and reuse the '√' constant from the 'Got It' model):

If you now restart the application you will notice that when you press 'Got It', the item's status changes to '√', and the 'Got It' button disappears.
Download Model: Stage 5, Final Model (version 2.4.1) Next: Classifying items by (mutually exclusive) categoriesSee Also:

To use the full functionality of this web site, JavaScript needs to be turned on.

For best results, use the Firefox browser..

Loading ...