123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960 |
- <!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>
|