sample check all checkboxes stimulus controller with operator

check_column_controller.js

import { Controller } from '@hotwired/stimulus'

export default class extends Controller {
  static targets = [ 'header', 'row', 'operator' ]

  headerToggle() {
    let switch_status = this.headerTarget.checked
    this.rowTargets.forEach(box => {
      if (!box.disabled) { box.checked = switch_status; }
    })
    this.checkOperator()
  }

  checkOperator() {
    let someChecked = this.rowTargets.some((row) => row.checked)
    let someUnchecked = this.rowTargets.some((row) => !row.checked)
    this.headerTarget.indeterminate = (someChecked && someUnchecked)
    if (this.hasOperatorTarget) {
      this.operatorTarget.disabled = !someChecked
    }
  }

  performOperator() {
    let val = this.operatorTarget.value;
    if (val !== '') {
      if (val === 'Delete') {
        if (confirm('Are you sure you want to delete these programs?')) {
          return this.operatorTarget.form.submit();
        }
      } else if (val === 'Email') {
        let emails = [];
        document.querySelectorAll('table.memberships td.checkbox input:checked').forEach((row) => {
          emails.push(row.parentElement.parentElement.querySelector('td.email').textContent);
        });
        window.open('mailto:' + emails.join());
      } else {
        this.operatorTarget.form.submit();
      }
    }
  }

}

table.html.haml

= form_with url: [objects, :group_batch_updates], data: { controller: 'check-column' }, local: true do |form|
  = form.fields_for :group_batch_update do |batch_form|
    %table.table.table-striped#active{'data-toggle': 'table'}
      %thead.table-secondary.sticky
        %tr
          %th= check_box_tag :switch, 'selected', false, data: { 'check-column-target': 'header', action: 'change->check-column#headerToggle' }, class: 'switch form-check-input'
          %th Name

      %tbody
        - @objects.each do |object|
          %tr
            %td.checkbox= form.check_box :objects, { multiple: true, data: { 'check-column-target': 'row', action: 'change->check-column#checkOperator' }, class: 'form-check-input' }, object.id
            %td= object.name

    %br

  .form-group.row
    = form.label :operation, 'With Selected:', class: 'col-sm-2 col-form-label'
    .col-2= form.select :operation, [['Delete All', 'Delete All']], { include_blank: 'Choose One..' }, disabled: true, data: { 'check-column-target': 'operator', action: 'change->check-column#performOperator' }, class: 'form-control form-select form-control-sm'