fixed issue edit pattern not applied

adobe · Jan 5, 2024 · d848697 · d848697
1 parent 53de10c
commit d848697
Show file tree

Hide file tree

Showing 4 changed files with 54 additions and 6 deletions.
diff --git a/...pps/core/fd/components/form/datepicker/v1/datepicker/clientlibs/site/js/datepickerview.js b/...pps/core/fd/components/form/datepicker/v1/datepicker/clientlibs/site/js/datepickerview.js
@@ -16,7 +16,7 @@
 (function() {
 
     "use strict";
-    class DatePicker extends FormView.FormFieldBase {
+    class DatePicker extends FormView.FormDatePicker {
 
         static NS = FormView.Constants.NS;
         static IS = "adaptiveFormDatePicker";
@@ -64,6 +64,7 @@
                 if (this.isActive()) {
                     this.widgetObject.setValue(value);
                 } else {
+                    this._model.value = this.widgetObject.getValue();
                     this.widgetObject.setDisplayValue(value);
                 }
             } else {
@@ -78,10 +79,10 @@
                     this.widgetObject = new DatePickerWidget(this, this.getWidget(), model);
                 }
                 if (this.widgetObject.getValue() !== '') {
-                    this._model.value = this.widgetObject.getValue();
+                    super.updateFormattedDate(this.widgetObject.getValue());
                 }
                 this.widgetObject.addEventListener('blur', (e) => {
-                    this._model.value = this.widgetObject.getValue();
+                    super.updateFormattedDate(e.target.value);
 
                     //setDisplayValue is required for cases where value remains same while focussing in and out.
                     this.widgetObject.setDisplayValue(this._model.value);

diff --git a/ui.frontend/src/index.js b/ui.frontend/src/index.js
@@ -16,7 +16,7 @@
 import Utils from "./utils.js";
 import LanguageUtils from "./LanguageUtils.js";
 import {createFormInstance, FileObject, extractFileInfo, Click, Change, Submit, Blur, AddItem, RemoveItem, CustomEvent} from "@aemforms/af-core";
-import {FormField, FormContainer, FormFieldBase, FormPanel, FormTabs, FormCheckBox, FormOptionFieldBase} from "./view/index.js";
+import {FormField, FormContainer, FormFieldBase, FormPanel, FormTabs, FormCheckBox, FormOptionFieldBase, FormDatePicker} from "./view/index.js";
 import {Constants} from "./constants.js";
 import GuideBridge from "./GuideBridge.js";
 import HTTPAPILayer from "./HTTPAPILayer.js";
@@ -77,4 +77,4 @@ const FileAttachmentUtils = {
  */
 
 
-export {createFormInstance, FormTabs, FormField, FormFieldBase, FormPanel, FormContainer, Constants, Utils, Actions, HTTPAPILayer, FileAttachmentUtils, Formatters, LanguageUtils, FunctionRuntime, FormCheckBox, FormOptionFieldBase};
+export {createFormInstance, FormTabs, FormField, FormFieldBase, FormPanel, FormContainer, Constants, Utils, Actions, HTTPAPILayer, FileAttachmentUtils, Formatters, LanguageUtils, FunctionRuntime, FormCheckBox, FormOptionFieldBase, FormDatePicker};
diff --git a/ui.frontend/src/view/FormDatePicker.js b/ui.frontend/src/view/FormDatePicker.js
@@ -0,0 +1,46 @@
+/*******************************************************************************
+ * Copyright 2024 Adobe
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ ******************************************************************************/
+
+import FormFieldBase from "./FormFieldBase.js";
+import {parse} from "@aemforms/af-formatters";
+
+/**
+ * Class representing Date picker.
+ * @extends module:FormView~FormDatePicker
+ */
+class FormDatePicker extends FormFieldBase {
+
+    constructor(params) {
+        super(params);
+    }
+
+    updateFormattedDate(value){
+        this._model.value = this.formatDate(value);
+    }
+
+    formatDate(value) {
+        const currDate = parse(value.toString(), this._model.locale, this._model.editFormat, null, false);
+        if (currDate && !isNaN(currDate) && value != null) {
+            this.selectedMonth = currDate.getMonth();
+            this.selectedYear = currDate.getFullYear();
+            this.selectedDay = currDate.getDate();
+            return this.selectedYear + "-" + (this.selectedMonth + 1) +"-"+ this.selectedDay + "";
+        } else return value;
+    }
+
+}
+
+export default FormDatePicker;
diff --git a/ui.frontend/src/view/index.js b/ui.frontend/src/view/index.js
@@ -20,6 +20,7 @@ import FormPanel from "./FormPanel.js";
 import FormTabs from "./FormTabs.js";
 import FormCheckBox from "./FormCheckBox.js";
 import FormOptionFieldBase from "./FormOptionFieldBase";
+import FormDatePicker from "./FormDatePicker";
 
 
-export {FormField, FormContainer, FormFieldBase, FormPanel, FormTabs, FormCheckBox, FormOptionFieldBase}
+export {FormField, FormContainer, FormFieldBase, FormPanel, FormTabs, FormCheckBox, FormOptionFieldBase, FormDatePicker}