| --- |
| layout: default |
| title: Tag Developers Guide |
| --- |
| |
| # datetimepicker |
| |
| > NOTE: Ajax template (Dojo plugin) is deprecated and won't be supported any longer. |
| |
| __Description__ |
| |
| |
| |
| {% comment %}start snippet id=javadoc|javadoc=true|url=struts2/plugins/dojo/src/main/java/org/apache/struts2/dojo/components/DateTimePicker.java {% endcomment %} |
| <p> <p> |
| Renders a date/time picker in a dropdown container. |
| </p> |
| <p> |
| A stand-alone DateTimePicker widget that makes it easy to select a date/time, or increment by week, month, |
| and/or year. |
| </p> |
| |
| <p> |
| It is possible to customize the user-visible formatting with either the |
| 'formatLength' (long, short, medium or full) or 'displayFormat' attributes. By defaulty current |
| locale will be used.</p> |
| </p> |
| |
| Syntax supported by 'displayFormat' is (http://www.unicode.org/reports/tr35/tr35-4.html#Date_Format_Patterns):- |
| <table border="1"> |
| <tr> |
| <td>Format</td> |
| <td>Description</td> |
| </tr> |
| <tr> |
| <td>d</td> |
| <td>Day of the month</td> |
| </tr> |
| <tr> |
| <td>D</td> |
| <td>Day of year</td> |
| </tr> |
| <tr> |
| <td>M</td> |
| <td>Month - Use one or two for the numerical month, three for the abbreviation, or four for the full name, or 5 for the narrow name.</td> |
| </tr> |
| <tr> |
| <td>y</td> |
| <td>Year</td> |
| </tr> |
| <tr> |
| <td>h</td> |
| <td>Hour [1-12].</td> |
| </tr> |
| <tr> |
| <td>H</td> |
| <td>Hour [0-23].</td> |
| </tr> |
| <tr> |
| <td>m</td> |
| <td>Minute. Use one or two for zero padding.</td> |
| </tr> |
| <tr> |
| <td>s</td> |
| <td>Second. Use one or two for zero padding.</td> |
| </tr> |
| </table> |
| |
| <p> |
| The value sent to the server is a locale-independent value, in a hidden field as defined |
| by the name attribute. The value will be formatted conforming to RFC3 339 |
| (yyyy-MM-dd'T'HH:mm:ss) |
| </p> |
| <p> |
| The following formats(in order) will be used to parse the values of the attributes 'value', |
| 'startDate' and 'endDate': |
| </p> |
| <ul> |
| <li>SimpleDateFormat built using RFC 3339 (yyyy-MM-dd'T'HH:mm:ss) |
| <li>SimpleDateFormat.getTimeInstance(DateFormat.SHORT) |
| <li>SimpleDateFormat.getDateInstance(DateFormat.SHORT) |
| <li>SimpleDateFormat.getDateInstance(DateFormat.MEDIUM) |
| <li>SimpleDateFormat.getDateInstance(DateFormat.FULL) |
| <li>SimpleDateFormat.getDateInstance(DateFormat.LONG) |
| <li>SimpleDateFormat built using the value of the 'displayFormat' attribute(if any) |
| </ul> |
| </p> |
| {% comment %}end snippet id=javadoc|javadoc=true|url=struts2/plugins/dojo/src/main/java/org/apache/struts2/dojo/components/DateTimePicker.java {% endcomment %} |
| |
| __Parameters__ |
| |
| |
| |
| {% comment %}start snippet id=tagattributes|javadoc=false|url=struts2-tags/ajax/datetimepicker.html {% endcomment %} |
| <p> <table width="100%"> |
| |
| <tr> |
| |
| <td colspan="6"><h4>Dynamic Attributes Allowed:</h4> false</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td colspan="6"> </td> |
| |
| </tr> |
| |
| <tr> |
| |
| <th align="left" valign="top"><h4>Name</h4></th> |
| |
| <th align="left" valign="top"><h4>Required</h4></th> |
| |
| <th align="left" valign="top"><h4>Default</h4></th> |
| |
| <th align="left" valign="top"><h4>Evaluated</h4></th> |
| |
| <th align="left" valign="top"><h4>Type</h4></th> |
| |
| <th align="left" valign="top"><h4>Description</h4></th> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">accesskey</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html accesskey attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">adjustWeeks</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Boolean</td> |
| |
| <td align="left" valign="top">If true, weekly size of calendar changes to acomodate the month if false, 42 day format is used</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">cssClass</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">The css class to use for element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">cssErrorClass</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">The css error class to use for element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">cssErrorStyle</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">The css error style definitions for element to use</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">cssStyle</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">The css style definitions for element to use</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">dayWidth</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">narrow</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">How to render the names of the days in the header(narrow, abbr or wide)</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">disabled</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html disabled attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">displayFormat</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">A pattern used for the visual display of the formatted date, e.g. dd/MM/yyyy</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">displayWeeks</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">6</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Integer</td> |
| |
| <td align="left" valign="top">Total weeks to display</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">endDate</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">2941-10-12</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Date</td> |
| |
| <td align="left" valign="top">Last available date in the calendar set</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">errorPosition</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Define error position of form element (top|bottom)</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">formatLength</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">short</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Type of formatting used for visual display. Possible values are long, short, medium or full</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">iconPath</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Path to icon used for the dropdown</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">id</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">HTML id attribute</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">javascriptTooltip</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Boolean</td> |
| |
| <td align="left" valign="top">Use JavaScript to generate tooltips</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">key</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the key (name, value, label) for this particular component</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">label</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Label expression used for rendering an element specific label</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">labelSeparator</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">:</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">String that will be appended to the label</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">labelposition</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Define label position of form element (top/left)</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">language</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">brower's specified preferred language</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Language to display this widget in</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">name</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">The name to set for element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onblur</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top"> Set the html onblur attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onchange</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onchange attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onclick</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onclick attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">ondblclick</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html ondblclick attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onfocus</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onfocus attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onkeydown</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onkeydown attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onkeypress</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onkeypress attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onkeyup</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onkeyup attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onmousedown</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onmousedown attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onmousemove</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onmousemove attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onmouseout</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onmouseout attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onmouseover</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onmouseover attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onmouseup</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onmouseup attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">onselect</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html onselect attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">requiredLabel</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Boolean</td> |
| |
| <td align="left" valign="top">If set to true, the rendered element will indicate that input is required</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">requiredPosition</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Define required position of required form element (left|right)</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">startDate</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">1492-10-12</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Date</td> |
| |
| <td align="left" valign="top">First available date in the calendar set</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">staticDisplay</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Boolean</td> |
| |
| <td align="left" valign="top">Disable all incremental controls, must pick a date in the current display</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">style</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">The css style definitions for element to use - it's an alias of cssStyle attribute.</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">tabindex</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html tabindex attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">template</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">The template (other than default) to use for rendering the element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">templateCssPath</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Template css path</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">templateDir</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">The template directory.</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">title</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the html title attribute on rendered html element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">toggleDuration</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">100</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Integer</td> |
| |
| <td align="left" valign="top">Duration of toggle in milliseconds</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">toggleType</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">plain</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">oggle type of the dropdown. Possible values are plain,wipe,explode,fade</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">tooltip</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Set the tooltip of this particular component</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">tooltipConfig</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Deprecated. Use individual tooltip configuration attributes instead.</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">tooltipCssClass</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">StrutsTTClassic</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">CSS class applied to JavaScrip tooltips</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">tooltipDelay</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Classic</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Delay in milliseconds, before showing JavaScript tooltips </td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">tooltipIconPath</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Icon path used for image that will have the tooltip</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">type</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">date</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Defines the type of the picker on the dropdown. Possible values are 'date' for a DateTimePicker, and 'time' for a timePicker</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">value</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Preset the value of input element</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">valueNotifyTopics</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top"></td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">String</td> |
| |
| <td align="left" valign="top">Comma delimmited list of topics that will published when a value is selected</td> |
| |
| </tr> |
| |
| <tr> |
| |
| <td align="left" valign="top">weekStartsOn</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">0</td> |
| |
| <td align="left" valign="top">false</td> |
| |
| <td align="left" valign="top">Integer</td> |
| |
| <td align="left" valign="top">Adjusts the first day of the week 0==Sunday..6==Saturday</td> |
| |
| </tr> |
| |
| </table> |
| |
| </p> |
| {% comment %}end snippet id=tagattributes|javadoc=false|url=struts2-tags/ajax/datetimepicker.html {% endcomment %} |
| |
| __Examples__ |
| |
| |
| |
| {% comment %}start snippet id=example1|lang=xml|javadoc=true|url=struts2/plugins/dojo/src/main/java/org/apache/struts2/dojo/components/DateTimePicker.java {% endcomment %} |
| |
| ```xml |
| <sx:datetimepicker name="order.date" label="Order Date" /> |
| <sx:datetimepicker name="delivery.date" label="Delivery Date" displayFormat="yyyy-MM-dd" /> |
| <sx:datetimepicker name="delivery.date" label="Delivery Date" value="%{date}" /> |
| <sx:datetimepicker name="delivery.date" label="Delivery Date" value="%{'2007-01-01'}" /> |
| <sx:datetimepicker name="order.date" label="Order Date" value="%{'today'}"/> |
| |
| ``` |
| |
| {% comment %}end snippet id=example1|lang=xml|javadoc=true|url=struts2/plugins/dojo/src/main/java/org/apache/struts2/dojo/components/DateTimePicker.java {% endcomment %} |
| |
| Getting and getting the datetimepicker value, from JavaScript: |
| |
| |
| {% comment %}start snippet id=example2|lang=xml|javadoc=true|url=struts2/plugins/dojo/src/main/java/org/apache/struts2/dojo/components/DateTimePicker.java {% endcomment %} |
| |
| ```xml |
| <sx:datetimepicker id="picker" label="Order Date" /> |
| <script type="text/javascript"> |
| function setValue() { |
| var picker = dojo.widget.byId("picker"); |
| |
| //string value |
| picker.setValue('2007-01-01'); |
| |
| //Date value |
| picker.setValue(new Date()); |
| } |
| |
| function showValue() { |
| var picker = dojo.widget.byId("picker"); |
| |
| //string value |
| var stringValue = picker.getValue(); |
| alert(stringValue); |
| |
| //date value |
| var dateValue = picker.getDate(); |
| alert(dateValue); |
| } |
| </script> |
| |
| ``` |
| |
| {% comment %}end snippet id=example2|lang=xml|javadoc=true|url=struts2/plugins/dojo/src/main/java/org/apache/struts2/dojo/components/DateTimePicker.java {% endcomment %} |
| |
| Publish topic when value changes |
| |
| |
| {% comment %}start snippet id=example3|lang=xml|javadoc=true|url=struts2/plugins/dojo/src/main/java/org/apache/struts2/dojo/components/DateTimePicker.java {% endcomment %} |
| |
| ```xml |
| <sx:datetimepicker id="picker" label="Order Date" valueNotifyTopics="/value"/> |
| |
| <script type="text/javascript"> |
| dojo.event.topic.subscribe("/value", function(textEntered, date, widget){ |
| alert('value changed'); |
| //textEntered: String enetered in the textbox |
| //date: JavaScript Date object with the value selected |
| //widet: widget that published the topic |
| }); |
| </script> |
| |
| ``` |
| |
| {% comment %}end snippet id=example3|lang=xml|javadoc=true|url=struts2/plugins/dojo/src/main/java/org/apache/struts2/dojo/components/DateTimePicker.java {% endcomment %} |