checkov.js

Der freundliche Formular-Checker

Mission Statement

TLDR

checkov.js sucht sich auf der Seite Formulare zusammen und führt Javascript-Aktionen durch, wenn das Feld:

Implementation: Formular

Einfach den betreffenden Formularen die Klasse .checkov-checkable verpassen, danach checkov.js einbinden, keine Konfiguration nötig.

Implementation: Submit-Knopf

submit.addEventListener("click", function() {
  var e = checkov.checker.all();
  if(e == true) {
    b_form.submit();
  }
});

Hiermit stellt man sicher, dass zu jeder Zeit der checkov-test läuft, bevor man das Formular evtl am Browser-HTML5-Formularcheck vorbei versendet. Sollten sich nocch Fehler im Formular befinden, springen wir dorthin.

Implementation: change

var selectors = ['venue','line','dir','complaint','schoolly-1'];
for(var i=0;i<selectors.length;i++) {
  var s = document.querySelector('#' + selectors[i]);
  if(undefined != s) {
    s.addEventListener("change", function() {
      checkov.checker.field(this);
    });
  }
}

Auf diese Weise bekommt man die Hinweise weg, nachdem tatsächlich etwas ausgewählt wurde, gut für chckboxen, radiobuttons und selctoren.

Implementation: blur

if((checkov.structure.requireds.INPUT.text.indexOf(e.id) != -1)

|| (checkov.structure.requireds.TEXTAREA.indexOf(e.id) != -1)) {

    //~ console.log(e.id,'ist in',checkov.structure.requireds.INPUT.text);
  checkov.checker.field(e);
}

Hier wird checkov nur gerufen, wenn es sich um Mitglieder der input- oder textarea-Gattung handelt. Blur bei select bringt nichts, ist bereits gecheckt onChange.

Tip: Funktioniert gut mit foermchen.js