Zum Inhalt springen

Powermail - Abhängige Validierung von zwei Input Feldern

Erstellt am 17. Juni 2009 · 10 Antworten · letzte Antwort am 19. Juni 2009

Tags: Powermail, JavaScript & AJAX, Frage

dabjoern ·

Hallo Leute,

ich habe folgendes Problem. Ich habe zwei Inputfelder A und B. Falls A und B nicht ausgefüllt werden, soll eine Fehlermeldung mit Hinweis erscheinen, dass mindestens ein Feld gefüllt werden muss. Wird Feld A oder B bzw. werden beide Felder gefüllt, ist alles okay, d.h. das Formular kann abgesendet werden.

In der Doku http://tetlaw.id.au/view/javascript/really-easy-field-validation zum Validierungsscript habe ich gesehen, dass es eine class="validate-one-required" gibt, die meine Validierungsprobleme lösen könnte (oder nicht). Nur wie kann ich den beiden Inputfeldern bzw. dem letzten Inputfeld die Klasse mitgeben oder das Ganze so zum Laufen bringen?

Grüße und danke, dabjoern

einpraegsam.​net ·

Diese Klasse gilt nur für Checkboxen (so weit ich mich erinnern kann).

http://www.einpraegsam.net/fachliches/typo3-extensions/powermail-cond.html
Hier habe ich das mit einem kleinen JS gelöst:

onfocus="if (document.getElementById('uid34').value == '' && document.getElementById('uid35').value == '') alert('Bitte Telefonnummer oder E-Mail eintragen!'); else this.form.submit();"

So etwas lässt sich manuell mit powermail_cond eintragen

Das ist natürlich eine dreckige Lösung - vielleicht lässt sich auch etwas über JS regEx machen - aber hier fehlt mir die Erfahrung:
http://typo3.org/documentation/document-library/extension-manuals/powermail/1.4.15/view/1/10/#id4324174
(Bereich Standard JS austauschen)

dabjoern ·

Hallo Alex,

ich würde gerne die ganze Validierung in einem Look & Feel haben. Ich finde es komisch, wenn einmal die Validierung via Prototype unter jedem Fall ad hoc geschieht und für die zwei anderen Felder das IMHO "old school" Alert Fenster kommt. Ich bin leider nicht der große JavaScript Held, suche aber eine JS Lösung. Was ist, wenn ich eine Summe sponsore und das irgendwie in powermail / powermail_cond als neues Feature eingebaut wird?

Viele Grüße, dabjoern

einpraegsam.​net ·

Mit einem kleinen Workarround über die regEx:
http://powermail.einpraegsam.net/index.php?id=4

Hier soll man Telefonnummer oder E-Mail eintragen müssen

Beispiel Formwrap HTML Template dazu:

<!-- ###POWERMAIL_FORMWRAP### begin -->
	<div class="tx-powermail-pi1_formwrap tx-powermail-pi1_formwrap_###POWERMAIL_FORM_UID###">
		<form name="###POWERMAIL_NAME###" id="###POWERMAIL_NAME###" action="###POWERMAIL_TARGET###" method="###POWERMAIL_METHOD###" class="tx_powermail_pi1_form" enctype="multipart/form-data">
			###POWERMAIL_MULTIPLE_PAGEBROWSER###
			<!-- ###POWERMAIL_CONTENT### --><!-- ###POWERMAIL_ITEM### -->
				<fieldset class="###OWNCSS###tx-powermail-pi1_fieldset tx-powermail-pi1_fieldset_###POWERMAIL_FIELDSETNAME_small### tx-powermail-pi1_fieldset_###POWERMAIL_FIELDSET_UID###" id="tx-powermail-pi1_fieldset_###POWERMAIL_FIELDSET_UID###"###POWERMAIL_JS###>
					<legend>###POWERMAIL_FIELDSETNAME###</legend>
					###POWERMAIL_FIELDS###
				</fieldset>
			<!-- ###POWERMAIL_ITEM### --><!-- ###POWERMAIL_CONTENT### -->
			###POWERMAIL_MULTIPLE_BACKLINK###
			###POWERMAIL_MULTIPLE_FORWARDLINK###
		</form>
		<script type="text/javascript">
			function formCallback(result, form) {
				window.status = "valiation callback for form '" + form.id + "': result = " + result;
			}
			var valid = new Validation('###POWERMAIL_NAME###', {immediate : true, onFormValidate : formCallback});
			Validation.add('powermail_uid16', 'Bitte E-Mail oder Telefonnummer eintragen!', {
				 notEqualToField : 'uid79',
			});
			Validation.add('powermail_uid79', 'Bitte E-Mail oder Telefonnummer eintragen!', {
				 notEqualToField : 'uid16',
			});
		</script>
		[Own HTML Template!]
	</div>
<!-- ###POWERMAIL_FORMWRAP### end -->
dabjoern ·

Coole Sache Alex. Das funktioniert schonmal ganz gut. Wenn ich für Feld A oder Feld B einen Wert eingebe, kann das Fomular abgesandt werden. Wenn ich nun aber für die Felder A und B jeweils einen Wert angebe, kann ich das Formular nicht absenden. Das muss aber auch möglich sein. Die Überprüfung heißt ja "notEqualToField". Kann man das irgendwie ergänzen, dass notEqualToField nur bei leeren Feldern gilt und nicht für gefüllte?

Viele Grüße und herzlichen Dank, dabjoern

einpraegsam.​net ·

Ich glaube nicht...
Es ist, wie du schreibst, nur ein Workarround in dem auf Gleichheit überprüft wird.

Das ist möglich:

Validation.add('class-name', 'Error message text', {
     pattern : new RegExp("^[a-zA-Z]+$","gi"), // only letter allowed
     minLength : 6, // value must be at least 6 characters
     maxLength : 13, // value must be no longer than 13 characters
     min : 5, // value is not less than this number
     max : 100, // value is not more than this number
     notOneOf : ['password', 'PASSWORD'], // value does not equal anything in this array
     oneOf : ['fish','chicken','beef'], // value must equal one of the values in this array
     is :  '5', // value is equal to this string
     isNot : 'turnip', //value is not equal to this string
     equalToField : 'password', // value is equal to the form element with this ID
     notEqualToField : 'username', // value is not equal to the form element with this ID
     include : ['validate-alphanum'] // also tests each validator included in this array of validator keys (there are no sanity checks so beware infinite loops!)
});
dabjoern ·

Das ist ja schonmal total cool, was von Haus aus möglich ist. Was können wir aber hier bei dem speziellen Problem machen? Wie ich bereits sagte, bin ich bereit, die Funktion finanziell zu unterstüzen. Wäre echt wichtig, hier eine Lösung zu finden.

Danke und viele Grüße, dabjoern

einpraegsam.​net ·
dabjoern schrieb

Das ist ja schonmal total cool, was von Haus aus möglich ist. Was können wir aber hier bei dem speziellen Problem machen? Wie ich bereits sagte, bin ich bereit, die Funktion finanziell zu unterstüzen. Wäre echt wichtig, hier eine Lösung zu finden.

Na hier fehlt es also ausnahmsweise nicht an den finanziellen Bedürfnissen - sondern eher am JS Know-How... 😃

dabjoern ·

Hallo,

der gute impi kam in einem kurzen Chat Gespräch auf folgende Lösung. In der validation.js unter typo3conf/ext/powermail/js/mandatoryjs muss nach notEqualToField Folgendes ergänzt werden:

    notBothFieldsEmpty : function(v,elm,opt) {
        if(v.length == 0 && $F(opt).length == 0 ) {
            return false;
        } else {
            return true;
        }
    },

In der von Alex vorgeschlagenen Template Datei für das formwrap habe ich dann Folgendes angepasst:

        <script type="text/javascript">
            function formCallback(result, form) {
                window.status = "valiation callback for form '" + form.id + "': result = " + result;
            }
            var valid = new Validation('###POWERMAIL_NAME###', {immediate : true, onFormValidate : formCallback});
            Validation.add('powermail_uid7', 'Bitte Seriennummer rechts oder links eingeben!', {
                 notBothFieldsEmpty : 'uid8',
            });
            Validation.add('powermail_uid8', 'Bitte Seriennummer rechts oder links eingeben!', {
                 notBothFieldsEmpty : 'uid7',
            });
        </script>

Damit klappt es dann! Super Sache!

Viele Grüße, dabjoern

EDIT: Vielleicht können die Änderungen in die Extension einfließen 😉