fixed crud list

fixed payments
upload -a

static/js/container_validation.js

@@ -0,0 +1,35 @@
+function validateContainerNumber(input) {
+    const containerNumber = input.value.trim();
+    const feedbackElement = input.nextElementSibling;
+
+    if (!containerNumber) {
+        input.classList.remove('invalid-container', 'incomplete-container');
+        if (feedbackElement) feedbackElement.remove();
+        return;
+    }
+
+    if (containerNumber.length > 0 && containerNumber.length < 11) {
+        input.classList.remove('invalid-container');
+        input.classList.add('incomplete-container');
+        if (feedbackElement) feedbackElement.remove();
+        return;
+    }
+
+    fetch(`${validateContainerUrl}${containerNumber}/`)
+        .then(response => response.json())
+        .then(data => {
+            input.classList.remove('incomplete-container');
+            if (!data.valid) {
+                input.classList.add('invalid-container');
+                if (!feedbackElement) {
+                    const feedback = document.createElement('div');
+                    feedback.className = 'validation-feedback';
+                    feedback.textContent = 'Invalid container number';
+                    input.parentNode.insertBefore(feedback, input.nextSibling);
+                }
+            } else {
+                input.classList.remove('invalid-container');
+                if (feedbackElement) feedbackElement.remove();
+            }
+        });
+}

static/js/crud-list.js

@@ -12,12 +12,10 @@ document.addEventListener('DOMContentLoaded', function() {
     table.addEventListener('click', function(e) {
         const row = e.target.closest('.selectable-row');
         if (!row) return;
-
         const checkbox = row.querySelector('input[type="checkbox"]');
         if (!checkbox) return;
 
         if (selectionMode === 'single') {
-            // Deselect all other rows
             table.querySelectorAll('.selected-row').forEach(selectedRow => {
                 if (selectedRow !== row) {
                     selectedRow.classList.remove('selected-row');
@@ -25,22 +23,15 @@ document.addEventListener('DOMContentLoaded', function() {
                 }
             });
         }
-
-        // Toggle current row
         row.classList.toggle('selected-row');
         checkbox.checked = !checkbox.checked;
-
-        // Update buttons state
         const selectedRows = table.querySelectorAll('.selected-row');
         document.querySelectorAll('[data-requires-selection]').forEach(button => {
             button.disabled = selectedRows.length === 0;
         });
-
-        // Handle edit/delete buttons from original crud-list.js
         const objectId = row.dataset.id;
         const editBtn = document.getElementById('editBtn');
         const deleteBtn = document.getElementById('deleteBtn');
-
         if (editBtn) {
             editBtn.removeAttribute('disabled');
             editBtn.href = editBtn.dataset.url?.replace('0', objectId);
@@ -54,19 +45,14 @@ document.addEventListener('DOMContentLoaded', function() {
     toggleSelectAllBtn.addEventListener('click', function() {
         const rows = table.querySelectorAll('.selectable-row');
         allSelected = !allSelected;
-
         rows.forEach(row => {
             const checkbox = row.querySelector('input[type="checkbox"]');
             checkbox.checked = allSelected;
             row.classList.toggle('selected-row', allSelected);
         });
-
-        // Update other buttons state
         document.querySelectorAll('[data-requires-selection]').forEach(button => {
             button.disabled = !allSelected;
         });
-
-        // Update button text
         this.textContent = allSelected ? 'Unselect All' : 'Select All';
     });