Change data-parsley-trigger from `change` to `blur`

[Abdull]

For a faster user feedback, I think it would be better to change data-parsley-trigger to blur at https://github.com/einpraegsam/powermail/blob/8.1.0/Classes/ViewHelpers/Validation/AbstractValidationViewHelper.php#L83 . This will give users direct feedback when input is incorrect.

With trigger set to change, as it currently is, an initially empty, but required input field does not have its validation triggered tabbing through this field.

[Abdull]

Actually, validation on keyup, i.e., on each keypress is even better for my purposes, because it gives feedback as soon as something was typed.

In order to have it work with powermail ~7.4.0, I have the following workaround in my JavaScript:

// configure Parsley (used by Powermail) for better accessibility (see https://stackoverflow.com/a/22591965/923560 )
// until Parsley provides better accessibility out-of-the-box (see https://github.com/guillaumepotier/Parsley.js/issues/640 ).
window.ParsleyConfig = {
  errorsWrapper: '<ul class="parsley-errors-list" aria-live="assertive"></ul>',
  trigger: 'keyup',
  validationThreshold: 0 // see https://github.com/guillaumepotier/Parsley.js/issues/1179
};

// document.addEventListener('DOMContentLoaded', function() { behaves slightly different, because data-parsley-trigger="keyup" is bound too late to be registered correctly
$(document).ready(function() {
  // See https://github.com/einpraegsam/powermail/issues/547
  document.querySelectorAll('[data-parsley-trigger]').forEach(function(element) {
    element.setAttribute('data-parsley-trigger', 'keyup');
  });

  // Enhance Powermail / Parsley form accessibility by adding aria-invalid
  // attributes during input validation,
  // ( see http://parsleyjs.org/doc/index.html#psly-usage-global-configuration#events-list )
  //until Parsley provides better accessibility out-of-the-box (see https://github.com/guillaumepotier/Parsley.js/issues/640 ).
  window.Parsley.on('field:error', function() {
    this.$element.attr('aria-invalid', 'true');
  });
  window.Parsley.on('field:success', function() {
    this.$element.attr('aria-invalid', 'false');
  });
});
// End of document-ready

[mschwemer]

Since EXT:powermail does not use parsley any more, I close this issue because it is not relevant any more.