diff --git a/app/src/View/Helper/FieldHelper.php b/app/src/View/Helper/FieldHelper.php
index 946a32afa..e6d3b7cd7 100644
--- a/app/src/View/Helper/FieldHelper.php
+++ b/app/src/View/Helper/FieldHelper.php
@@ -30,11 +30,12 @@
namespace App\View\Helper;
+use Cake\I18n\FrozenTime;
use \Cake\Utility\Inflector;
use Cake\View\Helper;
class FieldHelper extends Helper {
- public $helpers = ['Form', 'Html'];
+ public $helpers = ['Form', 'Html', 'Url'];
// Is this read-only or read-write?
protected $editable = true;
@@ -90,18 +91,66 @@ public function control(string $fieldName,
// Append the timezone to the label
$label = __d('field', $fieldName.".tz", [$this->_View->get('vv_tz')]);
- // Render these fields as datepickers instead of plain text boxes
- $coptions['class'] = 'datepicker-' . ($fieldName == 'valid_from' ? "f" : "u");
+ // A datetime field will be rendered as plain text input with adjacent date and time pickers
+ // that will interact with the field value. Allowing direct access to the input field is for
+ // accessibility purposes.
+ $coptions['class'] = 'form-control datepicker';
+ $coptions['placeholder'] = 'YYYY-MM-DD HH:MM:SS'; // TODO: test for date-only inputs and send only the date
+ $coptions['id'] = $fieldName;
$entity = $this->_View->get('vv_obj');
+ $pickerDate = '';
if(!empty($entity->$fieldName)) {
// Adjust the time back to the user's timezone
$coptions['value'] = $entity->$fieldName->i18nFormat("yyyy-MM-dd HH:mm:ss", $this->_View->get('vv_tz'));
+ $pickerDate = $entity->$fieldName->i18nFormat("yyyy-MM-dd", $this->_View->get('vv_tz'));
}
+ // Create a text field to hold our value.
$controlCode = $this->Form->text($fieldName, $coptions);
- $liClass = " modelbox-data";
+
+ // Create a date/time picker. The yyyy-MM-dd format is set above in $pickerDate.
+ $pickerDateTime = ''; // for handling time
+ $pickerId = 'datepicker-' . $fieldName;
+ $pickerTarget = $fieldName;
+ $pickerTimed = true; // TODO: set false if date-only
+ $pickerAmPm = false; // TODO: allow change between AM/PM and 24-hour mode
+ if(!empty($coptions['value'])) {
+ $pickerDateTime = $coptions['value'];
+ }
+ $controlCode .= '
+
+
+
+
+
';
+
+ $liClass = "fields-datepicker";
} else {
if($fieldName != 'status'
&& !isset($options['empty'])
diff --git a/app/templates/element/javascript.php b/app/templates/element/javascript.php
index f75048ac7..5f352ad51 100644
--- a/app/templates/element/javascript.php
+++ b/app/templates/element/javascript.php
@@ -169,50 +169,10 @@
}
});
- // Datepickers
-
-
-
-/* XXX CFM-107 Hide datepickers until replaced with new approach
- $(".datepicker-f").datepicker({
- changeMonth: true,
- changeYear: true,
- dateFormat: "yy-mm-dd 00:00:00",
- numberOfMonths: 1,
- showButtonPanel: false,
- showOtherMonths: true,
- selectOtherMonths: true,
- onSelect: function(selectedDate) {
- $(this).closest('.mdl-textfield').addClass('is-dirty');
- }
- }).bind('click',function () {
- $("#ui-datepicker-div").appendTo($(this).closest('.modelbox-data'));
- });
-
- $(".datepicker-u").datepicker({
- changeMonth: true,
- changeYear: true,
- dateFormat: "yy-mm-dd 23:59:59",
- numberOfMonths: 1,
- showButtonPanel: false,
- showOtherMonths: true,
- selectOtherMonths: true,
- onSelect: function(selectedDate) {
- $(this).closest('.mdl-textfield').addClass('is-dirty');
- }
- }).bind('click',function () {
- $("#ui-datepicker-div").appendTo($(this).closest('.modelbox-data'));
- });
-*/
-
// Add loading animation when a form is submitted, when any item with a "spin" class is clicked,
- // or on any button or anchor tag lacking the .nospin class.
- $("input[type='submit'], button:not(.nospin), a:not(.nospin), .spin").click(function() {
+ // or on any anchor tag lacking the .nospin class. We do not automatically add this to buttons
+ // because they are often on-page controls. Add a "spin" class to buttons that need it.
+ $("input[type='submit'], a:not('.nospin'), .spin").click(function() {
displaySpinner();
diff --git a/app/templates/layout/default.php b/app/templates/layout/default.php
index 356bd917b..ffa9f58d2 100644
--- a/app/templates/layout/default.php
+++ b/app/templates/layout/default.php
@@ -181,7 +181,7 @@
= $this->element('dialog'); ?>
- Html->script('jstimezonedetect/jstz.min.js'); ?>
+ = $this->Html->script('jstimezonedetect/jstz.min.js'); ?>