Force index filtering element id to kebab syntax

COmanage · May 16, 2022 · b25cb36 · b25cb36
1 parent 0d3ff1a
commit b25cb36
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 4 deletions.
diff --git a/app/templates/element/filter.php b/app/templates/element/filter.php
@@ -180,7 +180,7 @@
                 <?php
                   print $this->Form->label($key);
                   print $this->Form->checkbox($key, [
-                    'id' => $key,
+                    'id' => str_replace("_", "-", $key),
                     'class' => 'form-check-input',
                     'checked' => $query[$key] ?? 0,
                     'hiddenField' => false,
@@ -211,7 +211,7 @@
                   $coptions['required'] = false;
                   $coptions['placeholder'] = '';
 //                  $coptions['placeholder'] = 'YYYY-MM-DD HH:MM:SS';
-                  $coptions['id'] = $starts_field;
+                  $coptions['id'] = str_replace("_", "-", $starts_field);
 
                   $pickerDate = '';
                   if(!empty($query[$starts_field])) {
@@ -245,7 +245,7 @@
                   $coptions['placeholder'] = ''; // todo: Make this configurable
 //                  $coptions['placeholder'] = 'YYYY-MM-DD HH:MM:SS';
                   $coptions['label'] = 'Ends at:';
-                  $coptions['id'] = $ends_field;
+                  $coptions['id'] = str_replace("_", "-", $ends_field);
 
                   $pickerDate = '';
                   if(!empty($query[$ends_field])) {

diff --git a/app/templates/element/javascript.php b/app/templates/element/javascript.php
@@ -128,9 +128,21 @@
       e.stopPropagation();
       $(this).hide();
       $(this)[0].dataset.identifier.split(':').forEach( (ident) => {
-        let filterId = '#' + ident;
+        // CAKEPHP transforms snake case variables to kebab. As a result
+        // searching for the initial key will fail. This is used for use cases
+        // like the models that use the Tree behavior and have the column parent_id
+        let ident_to_snake = ident.replace(/_/g, "-");
+        let filterId = '#' + ident_to_snake;
         $(filterId).val("");
       });
+
+      // Remove the Vue date fields if exist
+      let dateWidgetInputs = document.querySelectorAll('duet-date-picker input');
+      // Remove all the Vue related fields
+      Array.prototype.slice.call(dateWidgetInputs).forEach( (el) => {
+        el.parentNode.removeChild(el);
+      });
+
       $(this).closest('form').submit();
     });