checkbox selectAll() fix

controllers/images.js

@@ -6,6 +6,10 @@ export const Images = async function(req, res) {
 
     let image_list = `
     <thead>
+        <!-- Hidden checkbox so that the form returns an array each time -->
+        <tr class="d-none">
+            <td><input class="form-check-input m-0 align-middle" name="select" value="on" type="checkbox" checked="" aria-label="Select"></td>
+        </tr>
         <tr>
             <th class="w-1"><input class="form-check-input m-0 align-middle" name="select" type="checkbox" aria-label="Select all" onclick="selectAll()"></th>
             <th><button class="table-sort" data-sort="sort-name">Name</button></th>
@@ -16,10 +20,6 @@ export const Images = async function(req, res) {
             <th><button class="table-sort" data-sort="sort-quantity">Size</button></th>
             <th><button class="table-sort" data-sort="sort-progress">Action</button></th>
         </tr>
-        <!-- Hidden checkbox so that the form returns an array each time -->
-        <tr class="d-none">
-            <td><input class="form-check-input m-0 align-middle" name="select" value="on" type="checkbox" checked="" aria-label="Select"></td>
-        </tr>
     </thead>
     <tbody class="table-tbody">`
 

controllers/networks.js

@@ -7,6 +7,10 @@ export const Networks = async function(req, res) {
 
     let network_list = `
         <thead>
+            <!-- Hidden checkbox so that the form returns an array each time -->
+            <tr class="d-none">
+                <td><input class="form-check-input m-0 align-middle" name="select" value="on" type="checkbox" checked="" aria-label="Select"></td>
+            </tr>
             <tr>
                 <th class="w-1"><input class="form-check-input m-0 align-middle" name="select" type="checkbox" aria-label="Select all" onclick="selectAll()"></th>
                 <th><button class="table-sort" data-sort="sort-name">Name</button></th>
@@ -15,10 +19,6 @@ export const Networks = async function(req, res) {
                 <th><button class="table-sort" data-sort="sort-date">Created</button></th>
                 <th><button class="table-sort" data-sort="sort-progress">Action</button></th>
             </tr>
-            <!-- Hidden checkbox so that the form returns an array each time -->
-            <tr class="d-none">
-                <td><input class="form-check-input m-0 align-middle" name="select" value="on" type="checkbox" checked="" aria-label="Select"></td>
-            </tr>
         </thead>
     <tbody class="table-tbody">`
 

controllers/volumes.js

@@ -8,6 +8,10 @@ export const Volumes = async function(req, res) {
 
     let volume_list = `
     <thead>
+        <!-- Hidden checkbox so that the form returns an array each time -->
+        <tr class="d-none">
+            <td><input class="form-check-input m-0 align-middle" name="select" value="on" type="checkbox" checked="" aria-label="Select"></td>
+        </tr>
         <tr>
             <th class="w-1"><input class="form-check-input m-0 align-middle" name="select" type="checkbox" aria-label="Select all" onclick="selectAll()"></th>
             <th><button class="table-sort" data-sort="sort-name">Name</button></th>
@@ -17,10 +21,6 @@ export const Volumes = async function(req, res) {
             <th><button class="table-sort" data-sort="sort-quantity">Size</button></th>
             <th><button class="table-sort" data-sort="sort-progress">Action</button></th>
         </tr>
-        <!-- Hidden checkbox so that the form returns an array each time -->
-        <tr class="d-none">
-            <td><input class="form-check-input m-0 align-middle" name="select" value="on" type="checkbox" checked="" aria-label="Select"></td>
-        </tr>
     </thead>
     <tbody class="table-tbody">`
 
@@ -73,22 +73,33 @@ export const Volumes = async function(req, res) {
 
 }
 
+export const createVolume = async function(req, res) {
+    
+    let name = req.body.name;
+
+    docker.createVolume({
+        Name: name
+    });
+    res.redirect("/volumes");
+}
 
 
 export const removeVolume = async function(req, res) {
     let volumes = req.body.select;
 
-    for (let i = 0; i < volumes.length; i++) {
+    console.log(volumes);
+
+    // for (let i = 0; i < volumes.length; i++) {
         
-        if (volumes[i] != 'on') {
-            try {
-                console.log(`Removing volume: ${volumes[i]}`);
-                let volume = docker.getVolume(volumes[i]);
-                await volume.remove();
-            } catch (error) {
-                console.log(`Unable to remove volume: ${volumes[i]}`);
-            }
-        }
-    }
+    //     if (volumes[i] != 'on') {
+    //         try {
+    //             console.log(`Removing volume: ${volumes[i]}`);
+    //             let volume = docker.getVolume(volumes[i]);
+    //             await volume.remove();
+    //         } catch (error) {
+    //             console.log(`Unable to remove volume: ${volumes[i]}`);
+    //         }
+    //     }
+    // }
     res.redirect("/volumes");
 }

views/images.html

@@ -100,12 +100,13 @@
     <script>
       function selectAll() {
         let checkboxes = document.getElementsByName('select');
-        if (checkboxes[0].checked == true) {
-          for (var i = 0; i < checkboxes.length; i++) {
+        // loops start at 1 to ignore the hidden checkbox
+        if (checkboxes[1].checked == true) {
+          for (var i = 1; i < checkboxes.length; i++) {
             checkboxes[i].checked = true;
           }
         } else {
-          for (var i = 0; i < checkboxes.length; i++) {
+          for (var i = 1; i < checkboxes.length; i++) {
             checkboxes[i].checked = false;
           }
         }

views/networks.html

@@ -115,12 +115,13 @@
     <script>
       function selectAll() {
         let checkboxes = document.getElementsByName('select');
-        if (checkboxes[0].checked == true) {
-          for (var i = 0; i < checkboxes.length; i++) {
+        // loops start at 1 to ignore the hidden checkbox
+        if (checkboxes[1].checked == true) {
+          for (var i = 1; i < checkboxes.length; i++) {
             checkboxes[i].checked = true;
           }
         } else {
-          for (var i = 0; i < checkboxes.length; i++) {
+          for (var i = 1; i < checkboxes.length; i++) {
             checkboxes[i].checked = false;
           }
         }

views/volumes.html

@@ -114,12 +114,13 @@
     <script>
       function selectAll() {
         let checkboxes = document.getElementsByName('select');
-        if (checkboxes[0].checked == true) {
-          for (var i = 0; i < checkboxes.length; i++) {
+        // loops start at 1 to ignore the hidden checkbox
+        if (checkboxes[1].checked == true) {
+          for (var i = 1; i < checkboxes.length; i++) {
             checkboxes[i].checked = true;
           }
         } else {
-          for (var i = 0; i < checkboxes.length; i++) {
+          for (var i = 1; i < checkboxes.length; i++) {
             checkboxes[i].checked = false;
           }
         }