massDelete.js 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. const initMassDelete = confirmation => {
  2. const tables = document.querySelectorAll(".card-admin-table")
  3. tables.forEach(table => initTableMassDelete(table, confirmation))
  4. }
  5. const initTableMassDelete = (table, confirmation) => {
  6. const form = table.querySelector("form")
  7. if (form === null) return
  8. const submit = form.querySelector("button")
  9. const toggle = table.querySelector("th input[type=checkbox]")
  10. const checkbox = table.querySelectorAll("td input[type=checkbox]")
  11. const updateState = () => {
  12. const checked = table.querySelectorAll("td input:checked")
  13. toggle.checked = checkbox.length === checked.length
  14. submit.disabled = checked.length === 0
  15. }
  16. updateState()
  17. toggle.addEventListener("change", event => {
  18. checkbox.forEach(element => (element.checked = event.target.checked))
  19. updateState()
  20. })
  21. checkbox.forEach(element => {
  22. element.addEventListener("change", updateState)
  23. })
  24. form.addEventListener("submit", event => {
  25. const checked = table.querySelectorAll("td input:checked")
  26. if (checked.length === 0 || !window.confirm(confirmation)) {
  27. event.preventDefault()
  28. return false
  29. }
  30. })
  31. }
  32. export default initMassDelete