=Taxonomy Selector and Creator refactor

Jake Vanderwerf

2026-01-04 552d48a1424417da160c4952650ea6f4a3d7bafa

 assets/js/concise/PopulateForm.js

@@ -388,9 +388,6 @@
      }
   }

   // ... rest of the methods stay the same (populateTextField, populateTextareaField, etc.)
   // I'll include the key ones that might need updating

   populateTextField(fieldWrapper, fieldName, fieldValue) {
      const input = fieldWrapper.querySelector(`[name="${fieldName}"], input, textarea`);
      if (input && input.type !== 'file') {
@@ -485,7 +482,221 @@
      return 'text';
   }

   // Include all other existing methods...
   /**
    * Populate number fields
    */
   populateNumberField(fieldWrapper, fieldName, fieldValue) {
      const input = fieldWrapper.querySelector(`[name="${fieldName}"], input[type="number"]`);
      if (input) {
         input.value = Number(fieldValue) || 0;
      }
   }

   /**
    * Populate boolean/true_false fields
    */
   populateBooleanField(fieldWrapper, fieldName, fieldValue) {
      const input = fieldWrapper.querySelector(`[name="${fieldName}"], input[type="checkbox"]`);
      if (input) {
         input.checked = Boolean(fieldValue);
      }
   }

   /**
    * Populate select/radio fields
    */
   populateSelectField(fieldWrapper, fieldName, fieldValue) {
      const value = String(fieldValue || '');

      // Try select first
      const select = fieldWrapper.querySelector(`select[name="${fieldName}"]`);
      if (select) {
         select.value = value;
         return;
      }

      // Try radio buttons
      const radio = fieldWrapper.querySelector(`input[type="radio"][name="${fieldName}"][value="${value}"]`);
      if (radio) {
         radio.checked = true;
      }
   }

   /**
    * Populate set/checkbox fields (multiple selections)
    */
   populateSetField(fieldWrapper, fieldName, fieldValue) {
      // Parse value if it's a string
      let values = fieldValue;
      if (typeof fieldValue === 'string') {
         try {
            values = JSON.parse(fieldValue);
         } catch (e) {
            values = fieldValue.split(',').map(v => v.trim());
         }
      }

      if (!Array.isArray(values)) {
         values = [String(values)];
      }

      // Update checkboxes
      fieldWrapper.querySelectorAll(`input[type="checkbox"][name*="${fieldName}"]`).forEach(checkbox => {
         checkbox.checked = values.includes(checkbox.value);
      });
   }

   /**
    * Populate date/time fields
    */
   populateDateField(fieldWrapper, fieldName, fieldValue) {
      const input = fieldWrapper.querySelector(`[name="${fieldName}"], input`);
      if (input && fieldValue) {
         // Handle different date formats
         let dateValue = fieldValue;
         if (typeof fieldValue === 'object' && fieldValue.date) {
            dateValue = fieldValue.date;
         }

         // Convert to appropriate format for input type
         try {
            const date = new Date(dateValue);
            if (!isNaN(date.getTime())) {
               switch (input.type) {
                  case 'date':
                     input.value = date.toISOString().split('T')[0];
                     break;
                  case 'time':
                     input.value = date.toTimeString().slice(0, 5);
                     break;
                  case 'datetime-local':
                     input.value = date.toISOString().slice(0, 16);
                     break;
                  default:
                     input.value = dateValue;
               }
            }
         } catch (e) {
            input.value = dateValue;
         }
      }
   }

   /**
    * Populate location fields
    */
   populateLocationField(fieldWrapper, fieldName, fieldValue) {
      if (!fieldValue || typeof fieldValue !== 'object') {
         return;
      }

      // Location fields typically have sub-fields
      const subFields = ['address', 'lat', 'lng', 'street', 'city', 'province', 'postal_code', 'country'];

      subFields.forEach(subField => {
         if (fieldValue[subField] !== undefined) {
            const input = fieldWrapper.querySelector(`[name="${fieldName}_${subField}"], [name="${subField}"]`);
            if (input) {
               input.value = String(fieldValue[subField] || '');
            }
         }
      });
   }


   /**
    * Populate user fields (similar to taxonomy)
    */
   populateUserField(fieldWrapper, fieldName, fieldValue) {
      // Similar logic to taxonomy fields
      this.populateTaxonomyField(fieldWrapper, fieldName, fieldValue);
   }

   /**
    * Populate repeater fields
    */
   populateRepeaterField(fieldWrapper, fieldName, fieldValue) {
      if (!fieldValue || !Array.isArray(fieldValue)) {
         return;
      }

      const container = fieldWrapper.querySelector('.repeater-items');
      const template = fieldWrapper.querySelector('template');

      if (!container || !template) {
         console.warn(`Repeater field ${fieldName}: missing container or template`);
         return;
      }

      // Clear existing rows
      window.removeChildren(container);

      // Create rows for each data item
      fieldValue.forEach((rowData, index) => {
         if (!rowData || typeof rowData !== 'object') {
            return;
         }

         const row = window.getTemplate(template.className);
         if (!row) {
            console.warn(`Repeater field ${fieldName}: template not found`);
            return;
         }

         // Set row ID and update row number
         row.id = `${fieldWrapper.closest('form').id}-${fieldName}-row-${index}`;
         row.dataset.index = index;

         const rowNumber = row.querySelector('.row-number');
         if (rowNumber) {
            rowNumber.textContent = `#${index + 1}`;
         }

         // Update field names and populate values
         row.querySelectorAll('input, select, textarea').forEach(field => {
            const originalName = field.name;
            const newName = `${fieldName}:${index}:${originalName}`;
            const newId = `${fieldName}-${index}-${originalName}-${field.value}`;

            // Update field identifiers
            field.name = newName;
            field.id = newId;

            // Update label
            const label = field.nextElementSibling;
            if (label && label.tagName === 'LABEL') {
               label.htmlFor = newId;
            }

            // Populate field value
            if (rowData[originalName] !== undefined) {
               this.populateRepeaterFieldValue(field, originalName, rowData[originalName]);
            }
         });

         container.appendChild(row);
      });
   }

   /**
    * Populate individual repeater field value
    */
   populateRepeaterFieldValue(field, fieldName, fieldValue) {
      switch (field.type) {
         case 'checkbox':
            field.checked = Boolean(fieldValue);
            break;
         case 'radio':
            field.checked = field.value === String(fieldValue);
            break;
         case 'select-one':
         case 'select-multiple':
            field.value = String(fieldValue || '');
            break;
         default:
            field.value = String(fieldValue || '');
      }
   }
}

// Make available globally