sync

lib/ui/grid/column.js

@@ -105,13 +105,13 @@ export class GridTextColumn extends GridInputColumn {
 const SymbolDropdown = Symbol.for('ui-dropdown');
 
 export class GridDropdownColumn extends GridColumn {
-    static createEdit(trigger, col, wrapper, it) {
+    static createEdit(trigger, col, container, it) {
         const drop = new Dropdown({
             ...col.dropOptions,
-            wrapper
+            wrapper: container.parentElement
         });
-        drop.onselected = trigger;
-        drop.onexpanded = function () {
+        drop.onSelected = trigger;
+        drop.onExpanded = function () {
             if (it.__editing == null) {
                 it.__editing = {
                     [col.key]: true
@@ -211,8 +211,8 @@ export class GridDropdownColumn extends GridColumn {
         drop.disabled = enabled === false;
     }
 
-    static leaveEdit(element, wrapper) {
-        wrapper.querySelectorAll('.ui-drop-box.active').forEach(e => {
+    static leaveEdit(element, container) {
+        container.parentElement.querySelectorAll('.ui-drop-box.active').forEach(e => {
             if (e != null) {
                 e.classList.remove('active');
             }
@@ -221,8 +221,8 @@ export class GridDropdownColumn extends GridColumn {
         if (drop == null) {
             return;
         }
-        if (drop?.multiselect && typeof drop.oncollapsed === 'function') {
-            drop.oncollapsed();
+        if (drop?.multiSelect && typeof drop.onCollapsed === 'function') {
+            drop.onCollapsed();
         }
     }
 }
@@ -286,7 +286,16 @@ export class GridIconColumn extends GridColumn {
 }
 
 export class GridDateColumn extends GridColumn {
-    static createEdit(trigger, col) {
+    static createEdit(trigger, col, _container, vals) {
+        let enabled = col.enabled;
+        if (typeof enabled === 'string') {
+            enabled = vals.values[enabled];
+        } else if (typeof enabled === 'function') {
+            enabled = col.enabled(vals.values);
+        }
+        if (enabled === false) {
+            return super.create();
+        }
         const date = createElement('input', 'ui-grid-date-cell');
         date.required = true;
         date.type = 'date';
@@ -306,25 +315,45 @@ export class GridDateColumn extends GridColumn {
             if (isNaN(val) || /^\d{4}-\d{2}-\d{2}$/.test(val)) {
                 element.value = val;
             } else {
-                val = new Date((val - 621355968e9) / 10000);
+                val = new Date((val - 621355968e9) / 1e4);
                 const month = String(val.getMonth() + 1).padStart(2, '0');
                 const date = String(val.getDate()).padStart(2, '0');
                 element.value = `${val.getFullYear()}-${month}-${date}`;
             }
         } else {
-            element.innerText = val;
+            element.innerText = this.formatDate(val);
         }
     }
 
     static getValue(e) {
-        return e.target?.value;
+        const date = e.target?.valueAsDate;
+        if (date instanceof Date && !isNaN(date)) {
+            const year = date.getFullYear();
+            if (year < 1900 || year > 9999) {
+                return '';
+            }
+            return String(date.getTime() * 1e4 + 621355968e9);
+        }
+        return '';
     }
 
     static setEnabled(element, enabled) {
         element.disabled = enabled === false;
     }
 
+    static _resolveDate(s) {
+        if (s instanceof Date) {
+            return s;
+        }
+        const ticks = Number(s);
+        if (!isNaN(ticks) && ticks > 0) {
+            return new Date((ticks - 621355968e9) / 1e4);
+        }
+        return new Date(s);
+    }
+
     static formatDate(date) {
+        date = this._resolveDate(date);
         if (date instanceof Date && !isNaN(date)) {
             return `${date.getMonth() + 1}/${date.getDate()}/${date.getFullYear()}`;
         }