Skip to main content

jQuery Funktion um unsichtbare Formulare korrekt zu verarbeiten

Worum geht es

In HTML Formularen hat man de öfteren mit Feldern zu tun, die voneinander Abhängig sind. Dazu mal ein Beispiel

Für einen Online Versand wird über ein Dropdown-Menü gefragt

Bringst du noch Personen mit?
JA
NEIN

Und falls man dann auf JA klickt, erscheint ein neus Pflichtfeld, das nach der Menge fragt.

https://jsfiddle.net/2Lw5qgyc/7/embedded/result/?username=GerritKMeier

jQuery.fn.togglePattern=function() {
    elem=[];
    $.each(this,function  (k,v) {
// Falls ein INPUT Felld erforderlich ist (das Attribut "REQUIRED" besitzt...
        if ( $(v).prop('required') ) {
// ...das Attribut entfernen           
            $(v).prop('required',false);
// ... und im Objktspeicher zwischenlagern.           
            $(v).data('isRequired',true);
// Falls ein Element im Objektspeicher die Info enthält "isReuqired" aber des Feld derzeit optional ist, dann...           
        } else if ($(v).data('isRequired') && !$(v).prop('required') ) {
// Feld wieder zu einem Pflichtfeld machen
            $(v).prop('required',true);
// Objektspeicher bereinigen.           
            $(v).removeData('isRequired');
        }
 
        
        currentPattern = $(v).attr('pattern');
        patternStorage = $(v).data('pattern');
         
// Wenn sich ein Pattern im 'Zwischenspeicher' des Elements befindet dieses wiederherstellen
        if ( patternStorage !=="" ) {
               $(v).attr('pattern',patternStorage)
               $(v).data('pattern','');
        } else {
// ansonsten den Pattern in den Zwischenspeicher verschieben und aus der aktiven Patterndefinition entfernen
            $(v).data('pattern',currentPattern);
            $(v).removeAttr('pattern');
        }
        elem.push({"name":$(v).attr('name'),"pattern":$(v).attr('pattern')},"dataPattern",$(v).data('pattern'));  
         
    })
    console.log(JSON.stringify(elem));   
    return this;
}