From 34dd96d6131abcf4ab6e3d5297bcddcc2190fee3 Mon Sep 17 00:00:00 2001 From: Alexander Ebert Date: Wed, 13 Jul 2016 12:16:07 +0200 Subject: [PATCH] Added clear button for date input --- .../install/files/js/WoltLab/WCF/Date/Picker.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js b/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js index 2001ffb937..fc4eaff97a 100644 --- a/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js +++ b/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js @@ -114,6 +114,17 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment element.parentNode.insertBefore(container, element); container.insertBefore(element, button); + button = elCreate('a'); + button.className = 'inputSuffix button'; + button.addEventListener(WCF_CLICK_EVENT, this.clear.bind(this, element)); + if (isEmpty) button.style.setProperty('visibility', 'hidden', ''); + + container.appendChild(button); + + icon = elCreate('span'); + icon.className = 'icon icon16 fa-times'; + button.appendChild(icon); + // check if the date input has one of the following classes set otherwise default to 'short' var hasClass = false, knownClasses = ['tiny', 'short', 'medium', 'long']; for (var j = 0; j < 4; j++) { @@ -127,6 +138,7 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment } _data.set(element, { + clearButton: button, shadow: shadowElement, isDateTime: isDateTime, @@ -440,6 +452,7 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment _input.value = value; elData(_input, 'value', date.getTime()); + data.clearButton.style.removeProperty('visibility'); data.shadow.value = shadowValue; }, @@ -673,6 +686,7 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment element.removeAttribute('data-value'); element.value = ''; + data.clearButton.style.setProperty('visibility', 'hidden', ''); data.isEmpty = true; data.shadow.value = ''; }, -- 2.20.1