Merge pull request #8 from SourceLabsLLC/disable-button-when-no-selection

Update JS to toggle action buttons based on selections

Author: andreibondarev

app/assets/javascripts/administrate_batch_actions/script.js

@@ -2,22 +2,29 @@ var buttons = document.querySelectorAll("[data-batch-action-option='button']");
 var checkboxes = document.querySelectorAll("[data-batch-action-option='checkbox']");
 var selectAllCheckboxes = document.querySelector("[data-batch-action-option='select_all']");
 
-if (selectAllCheckboxes) {
+if (selectAllCheckboxes && checkboxes && buttons) {
+
+  window.onpageshow = function(event) {
+    if (selectedItemIds()) {
+      checkboxes.forEach(function(checkbox) {
+        checkbox.checked = false;
+      });
+
+      selectAllCheckboxes.checked = false;
+    }
+  };
+
   selectAllCheckboxes.addEventListener('click', function(){
     checkboxes.forEach(function(checkbox) {
       checkbox.checked = selectAllCheckboxes.checked;
     });
+
+    checkAndToggleActionButtons();
   });
 
   buttons.forEach(function(button){
     button.addEventListener('click', function(event){
-      var ids = Array.prototype.filter.call(checkboxes, function(checkbox) {
-        if (checkbox.checked) { return checkbox }
-      }).map(function(checkbox) {
-        return 'batch_action_ids[]=' + checkbox.value
-      }).join('&');
-
-      button.href += '?' + ids
+      button.href += '?' + selectedItemIds()
     });
   });
 
@@ -28,6 +35,29 @@ if (selectAllCheckboxes) {
 
     checkbox.addEventListener('click', function(event) {
       event.stopImmediatePropagation();
+
+      checkAndToggleActionButtons();
     })
   })
 }
+
+function selectedItemIds() {
+  var ids = Array.prototype.filter.call(checkboxes, function(checkbox) {
+        if (checkbox.checked) { return checkbox }
+      }).map(function(checkbox) {
+        return 'batch_action_ids[]=' + checkbox.value
+      }).join('&');
+  return ids;
+}
+
+function checkAndToggleActionButtons() {
+  if (selectedItemIds()) {
+    buttons.forEach(function(button){
+      button.classList.remove('disabled');
+    });
+  } else {
+    buttons.forEach(function(button){
+      button.classList.add('disabled');
+    });
+  }
+}

app/views/shared/administrate_batch_actions/_button.html.erb

@@ -1 +1 @@
-<%= link_to name, path, class: html_options[:class], data: { batch_action_option: 'button', confirm: html_options[:confirm] }, method: :post %>
+<%= link_to name, path, class: "btn disabled #{html_options[:class]}", data: { batch_action_option: 'button', confirm: html_options[:confirm] }, method: :post %>