Windows® 8.1 Apps with HTML5 and JavaScript Unleashed

Setting Control Options

Most controls support options. For example, when creating a TimePicker control, you want to be able to set the default time or the clock format (24-hour or 12-hour).

You can specify control options declaratively by taking advantage of the data-win-options attribute. For example, the following HTML fragment demonstrates how you can set the current time displayed by the TimePicker control to the time 3:04pm and the clock format to a 24-hour clock:

Click here to view code image

<div id="timeLunch"    data-win-control="WinJS.UI.TimePicker"    data-win-options="{        current: '3:04pm',        clock: '24HourClock'    }"></div>

The options object passed to a control is a JavaScript object—hence the curly braces around the ...