Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Properly disable form inputs #76

Closed
danielberkompas opened this issue Sep 5, 2017 · 1 comment
Closed

Properly disable form inputs #76

danielberkompas opened this issue Sep 5, 2017 · 1 comment

Comments

@danielberkompas
Copy link
Contributor

danielberkompas commented Sep 5, 2017

Recent changes to torch.js broke how it disables form inputs. I fixed it manually on one of our projects, and here's the updated code that works:

import Pikaday from 'pikaday'

window.onload = () => {
  const slice = Array.prototype.slice
  /*
   * Prevent empty fields from being submitted, since this breaks Filtrex.
   */
  const formFilters = document.querySelector('form#filters')
  if (!formFilters) return

  formFilters.addEventListener('submit', function (e) {
    e.preventDefault()

    let canSubmit = true

    slice.call(this.querySelectorAll('.field'), 0).forEach((field) => {
      let text = field.getElementsByTagName('label')[0].textContent
      let start = field.getElementsByClassName('start')[0]
      let end = field.getElementsByClassName('end')[0]

      if (start && end) {
        if (start.value === '' && end.value !== '') {
          window.alert(`Please select a start date for the ${text} field`)
          canSubmit = false
        } else if (end.value === '' && start.value !== '') {
          window.alert(`Please select a end at date for the ${text} field`)
          canSubmit = false
        }
      }
    })

    if (canSubmit) {
      slice.call(this.querySelectorAll('input, select'), 0).forEach((field) => {
        if (field.value === '') {
          field.disabled = true
        }
      })

      e.target.submit()
    }
  })

  slice.call(document.querySelectorAll('select.filter-type'), 0).forEach((field) => {
    field.addEventListener('change', (e) => {
      e.target.nextElementSibling.name = e.target.value
    })
  })

  slice.call(document.querySelectorAll('.datepicker'), 0).forEach((field) => {
    new Pikaday({field: field})
  })
}
@zberkom
Copy link
Contributor

zberkom commented Apr 13, 2018

I addressed this in the latest v2.0.0-rc.1 release

@zberkom zberkom closed this as completed Apr 13, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants