Pickers
Pickers are used to present a common UI for selecting inputs in a variety of application scenarios. Mojo offers pickers for common objects such as a date, time, or number, or to select files.
The next section covers the first three pickers, since they are conventional widgets and are very similar to each other. After that, we will look at the File picker. It’s accessed through function calls, and is actually implemented as a separate application wrapped with a framework interface.
Simple Pickers
The models for the date, time, and integer pickers are very similar. The pickers are declared within your scene’s view file and wrapped with styling divs as shown here:
<div class="palm-group unlabeled">
<div class="palm-list">
<div id="DatePkrId" x-mojo-element="DatePicker"></div>
</div>
</div>This creates a picker that spans the width of the screen and is enclosed with an unlabeled group frame (as shown in Figure 5-6).

Figure 5-6. A Date Picker widget example
These pickers present choices as a linear sequence of values that wraps around; when you scroll to the end of the sequence, they simply continue back at the beginning. There’s no way to override this behavior.
Date pickers
As shown in Figure 5-6, a date
picker allows selection of month, day, and year values. The Date
picker’s model has a single property, named date by default, which should be assigned a JavaScript Date object. You can ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access