aboutsummaryrefslogtreecommitdiff
path: root/contexts/data/lib/closure-library/closure/goog/demos/inputdatepicker.html
blob: 1e6c25fe012e201d1cfac7fb6a6c7121909e1a48 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<!DOCTYPE html>
<html>
<!--
Copyright 2010 The Closure Library Authors. All Rights Reserved.

Use of this source code is governed by the Apache License, Version 2.0.
See the COPYING file for details.
-->
<head>
  <title>goog.ui.InputDatePicker</title>
  <script src="../base.js"></script>
  <script>
    goog.require('goog.dom');
    goog.require('goog.i18n.DateTimeFormat');
    goog.require('goog.i18n.DateTimeParse');
    goog.require('goog.ui.InputDatePicker');
    goog.require('goog.ui.LabelInput');
  </script>
  <link rel="stylesheet" href="css/demo.css">
  <link rel="stylesheet" href="../css/datepicker.css">
  <link rel="stylesheet" href="../css/inputdatepicker.css">
  <style>
    div {
      margin: 0 0 1em;
    }
  </style>
</head>
<body>
  <h1>goog.ui.InputDatePicker</h1>

  <div>
    <label for="date-field1">Date Field1:</label><input id="date-field1">
  </div>
  <div>
    <label for="date-field2">Date Field2:</label><span id="date-field2"></span>
  </div>
  <div>
    <label for="date-container"> Label Input Date Field:</label>
    <span id="date-container"></span>
  </div>
  <script>
    var PATTERN = "MM'/'dd'/'yyyy";
    var formatter = new goog.i18n.DateTimeFormat(PATTERN);
    var parser = new goog.i18n.DateTimeParse(PATTERN);

    var idp1 = new goog.ui.InputDatePicker(formatter, parser);
    idp1.decorate(goog.dom.getElement('date-field1'));

    var idp2 = new goog.ui.InputDatePicker(formatter, parser);
    idp2.render(goog.dom.getElement('date-field2'));

    // Use a LabelInput for this one:
    var fieldLabelInput = new goog.ui.LabelInput('MM/DD/YYYY');
    fieldLabelInput.render(goog.dom.getElement('date-container'));

    var idp3 = new goog.ui.InputDatePicker(formatter, parser);
    idp3.decorate(fieldLabelInput.getElement());
  </script>
</body>
</html>