4 <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8" >
5 <script src="../tizen-web-ui-fw/latest/js/jquery.min.js"></script>
6 <script src="../configure.js"></script>
7 <script src="../tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.min.js"></script>
8 <script src="../tizen-web-ui-fw/latest/js/tizen-web-ui-fw.min.js"
9 data-framework-theme="tizen-white"
10 data-framework-viewport-width="device-width">
12 <title>Tizen UI - Datefield</title>
13 <!-- for compatibility test -->
14 <meta name="apple-mobile-web-app-capable" content="yes" />
15 <meta name="apple-mobile-web-app-status-bar-style" content="black" />
16 <link rel="apple-touch-icon" href="../icon-tizen.png" />
19 <div data-role="page" id="datetimepicker-demo" data-add-back-btn="true">
20 <div data-role="header" data-position="fixed">
21 <h1>Date/time picker</h1>
23 <div data-role="content">
24 <ul data-role="listview">
25 <li data-role="list-divider" data-line="false" class="ui-datetime-text-sub" ><span id="selected-date1"><em>(select a date first)</em></span></li>
26 <li class="ui-li-dialogue ui-datetime">
27 <div class="ui-datetime-text-main">
28 <input type="datetime" name="demo-date" id="demo-date"
29 data-format="MMM dd yyyy hh:mm tt" value="2012-06-30T00:00:00+09:00" />
32 <li data-role="list-divider" data-line="false" class="ui-datetime-text-sub" ><span id="selected-date2"><em>(select a date first)</em></span></li>
33 <li class="ui-li-dialogue ui-datetime ui-datetime">
34 <div class="ui-datetime-text-main">
35 <input type="datetime" name="demo-date2" id="demo-date2" />
38 <li data-role="list-divider" data-line="false" class="ui-datetime-text-sub" ><span id="selected-date3"><em>(select a date first)</em></span></li>
39 <li class="ui-li-dialogue ui-datetime ui-datetime">
40 <div class="ui-datetime-text-main">
41 <input type="date" name="demo-date3" value="2012-06-30" id="demo-date3"/>
44 <li data-role="list-divider" data-line="false" class="ui-datetime-text-sub" ><span id="selected-date4"><em>(select a time first)</em></span> </li>
45 <li class="ui-li-dialogue ui-datetime ui-datetime">
46 <div class="ui-datetime-text-main">
47 <input type="time" name="demo-date4" id="demo-date4" />
50 <li data-role="list-divider" data-line="false" class="ui-datetime-text-sub" ><span id="selected-date5"><em>(select a date first)</em></span> </li>
51 <li class="ui-li-dialogue ui-datetime ui-datetime">
52 <div class="ui-datetime-text-main">
53 <input data-format="MM/dd/yyyy hh:mm tt" value="2013/1/31 15:08:44" type="datetime" id="demo-date5">
56 <li data-role="list-divider" data-line="false" class="ui-datetime-text-sub" ><span id="selected-date6"><em>(select a date first)</em></span> </li>
57 <li class="ui-li-dialogue ui-datetime ui-datetime">
58 <div class="ui-datetime-text-main">
59 <input data-format="MMMM/dd/yyyy" value="2013/1/31" type="date" id="demo-date6">
63 </div><!-- /content -->
64 <div data-role="footer">
66 <script src="datefield.js"></script>