Row selection with radio buttons

With Justinmind, you can use Radio Buttons to select rows in your Data List.

To learn how to do so, follow these steps:

  1. Go to the Data Masters palette and create a new Data Master by clicking on the ‘+’ icon.
  2. Name it “sample” and create three fields: Airline, Departing to and Terminal. Click “OK”.
  3. Double-click on the Data Master you’ve just created and select the tab “View and edit records”.
    • Write some example data there.
    • Click “OK”.
  4. Drag a Data List widget to the screen.
    • Name it “samples” and select the Data Master you’ve just created from the drop-down menu.
    • Select all the Data Master Fields available.
  5. Right click on the table and select “New column”. Hover over it with the mouse and when you see a white arrow above it, select it and place it to the furthest-left side.
    • data-driven-prototypes-radio-buttons-data-list
  6. Resize it and drag a Radio Button in the “Current_row_1” row.
    • data-driven-prototypes-radio-buttons
  7. Drag three Text widgets (Airline, Departing to and Terminal) and three Input Text Fields to the right of the Data List, to hold the values of the selected row.
  8. Select the Radio Button, go to the Events palette and add an “On Click” + “Set Value” event, selecting the Input Text Field next to “Airline” as the element that will display the value.
    • Select the “Calculate” button and build the expression displayed in the image below, by dragging – in this order – the “Select” and “Filter” functions, the first row of the Data List, the Radio Button, and finally the “Airline” field from the Data Master tab.
    • data-driven-prototypes-radio-buttons-select-filter-expression
    • This expression will select the first row (‘Current_Row_1″ under “sample” in the Outline palette) that has the radio button selected and will extract the field ‘Airline’ from it.
    • Click “OK” twice.
  9. Now click on the gear icon next to the word “Do” in the Events palette, and select “Add action”.
    • Repeat the same steps as above for the remaining two fields (Departing to and Terminal), just remember to change the field and the attribute in the expression. 

You can download an example here.