jQuery-Validation-Engine von Position Absolute - Bedingte Validierung von Formularfeldern

Question

Ich arbeite mit der Formularvalidierungs-Engine von Position Absolute.

Ich habe einen speziellen Fall für die Validierung, die ich hoffe, dass dies für mich lösen kann. Ich muss in der Lage sein, ein Feld erforderlich, basierend auf dem Wert eines anderen Feldes zu machen.

Zum Beispiel:

If country.dropdown = "USA", then state.dropdown is required.  

ou

If country.dropdown <> 'USA" then state.dropdown is not required.

Glauben Sie, dass dies mit JQuery Validation Engine möglich ist? Wenn ja, können Sie mich in die richtige Richtung weisen?

Answer 1

Zunächst einmal muss ich sagen, dass ich die Formularvalidierungs-Engine von Position Absolute noch nie verwendet habe, aber ich habe mich dafür interessiert, als ich Ihre Frage gelesen habe. Aus der Dokumentation ( https://github.com/posabsolute/jQuery-Validation-Engine ), scheint es, dass Sie eine benutzerdefinierte Validierungsfunktion erstellen müssen.

Ich habe hier eine funktionierende Fiedel erstellt: http://jsfiddle.net/5pKjW/6/

Auch wenn es funktioniert, bin ich nicht ganz zufrieden damit, denn wegen dieser Bedingung in der Validierungs-Engine in Zeile 584 ist ein "Sentinel-Wert" erforderlich.

// If the rules required is not added, an empty field is not validated
if(!required && field.val() == "" && !errorMsg) options.isError = false; 

Dies ist das Markup der Auswahl mit der benutzerdefinierten Funktion:

<select class="validate[funcCall[checkCountry]]" type="text" name="state" id="state">
    <option value="none" ></option>
    <option value="CALIFORNIA" >CALIFORNIA</option>
    <option value="NEW ENGLAND" >NEW ENGLAND</option>
    <option value="TEXAS" >TEXAS</option>
</select>

Und dies ist die Initialisierung des Validators:

jQuery("#formID").validationEngine({
    'customFunctions': {
        'checkCountry': function (field, rules, i, options){
            if ($('#country').val() === 'USA' && field.val() === 'none') {
                return options.allrules.required.alertText;
            }
        }
    }
});

1) Zuerst müssen Sie eine Validierungsfunktion definieren, die global sein kann oder als Argument des Plug-ins übergeben werden kann (wie ich es oben getan habe). Eine benutzerdefinierte Funktion nimmt folgende Eingaben entgegen: Feld, Regeln, i, Optionen. Sie haben keinen Verweis auf das Formular, sondern nur auf das aktuelle Feld. Wenn Sie also auf ein anderes Feld zugreifen wollen, müssen Sie es wie üblich mit jQuery auswählen (im Beispiel: $('#country') ).

2) Sie prüfen, ob die Validierungsbedingung erfüllt ist. Im Beispiel schlägt es fehl, wenn:

$('#country').val() === 'USA' && field.val() === 'none'

Wenn die Bedingung nicht erfüllt ist, muss die Funktion einen String zurückgeben. In diesem Beispiel habe ich die Standardmeldung in options.allrules.required zurückgegeben. In der Dokumentation wird erklärt, wie man benutzerdefinierte Meldungen für benutzerdefinierte Funktionen definiert.

Wie Sie sehen können, ist aufgrund der

if(!required && field.val() == "" && !errorMsg) options.isError = false;

Zeile in der Validierungsmaschine, ist der Entwickler gezwungen, die Bedingung innerhalb der if fehlschlagen, und die erforderliche Bedingung auf wahr oder die Fehlermeldung auf einen falschen Wert zu setzen, ist nicht richtig. Die einzige Möglichkeit ist also, die field.val() != '' . Aus diesem Grund hat das erste Optionselement im Markup den Sentinel-Wert none statt leer zu sein. Es ist keine saubere Lösung, und es kann sogar nicht möglich sein, leicht zu implementieren (ich weiß nicht, wenn Sie das Markup selbst generieren (wenn nicht, werden die Dinge schwieriger und Sie müssen das Formular über Javascript manipulieren, vor der Validierung Engine Initialisierung)).

Dies ist keine saubere Lösung. Eine schönere Lösung wäre die Verwendung von condRequired wenn es nur eine benutzerdefinierte Funktion akzeptiert hätte, anstatt nur zu prüfen, ob eines seiner Argumente ausgefüllt wurde.