jQuery über mehrere Felder hinweg validieren

Ich habe 3 Eingabefelder, die nach der Anzahl der Personen fragen, und davon, wie viele Erwachsene und wie viele Kinder sind. Ich versuche, das jQuery-Validierungs-Plugin zu verwenden, um eine benutzerdefinierte Methode hinzuzufügen, bei der Kinder + Erwachsene = Anzahl der Personen

Das ist mein Validierungsanruf

$("#form2").validate({
    errorElement: "span",
        rules: {
        attendees: {
             required: true,
             digits: true
        },              
        adults: {
             required: true,
             digits: true
        },              
        children: {
             required: true,
             digits: true
        }
    },
    messages: {
        attendees: "Enter the number of persons (including yourself)", 
        adults: "Enter number of adults", 
        children: "Enter number of childern"                
    }               
});

Ich habe mir die Gruppenfunktion angesehen und .addMethod() Methode des Validierungs-Plugins, aber es scheint, dass es nur mit Blick auf ein Element erstellt wurde. Irgendwelche Ideen?

Folgen die Dokumentation zum Erstellen einer benutzerdefinierten Methode/Regel. Hier nenne ich es einfach totalCheckaber Sie können es beliebig benennen.

$.validator.addMethod('totalCheck', function(value, element, params) {
    var field_1 = $('input[name="' + params[0] + '"]').val(),
        field_2 = $('input[name="' + params[1] + '"]').val();
    return parseInt(value) === parseInt(field_1) + parseInt(field_2);
}, "Enter the number of persons (including yourself)");

Sie wird wie jede andere Regel implementiert. Die beiden Parameter sind die name Attribute der beiden anderen Felder, die Sie prüfen möchten. Da diese neue Regel besagt, dass das Feld die Summe der beiden anderen Felder enthalten muss, die required und digits Regeln sind jetzt überflüssig und können entfernt werden.

$("#form2").validate({
    errorElement: "span",
    rules: {
        attendees: {
            totalCheck: ['adults', 'children'] // <-- your custom rule
        },
        adults: {
            required: true,
            digits: true
        },
        children: {
            required: true,
            digits: true
        }
    },
    messages: {
        adults: "Enter number of adults",
        children: "Enter number of childern"
    }
});

Funktionierende DEMO: http://jsfiddle.net/hBXL6/

BEARBEITEN:

Ein hinzugefügt keyup focusout Handler erneut zu validieren attendees wenn andere Felder geändert werden. Dies sind die gleichen zwei Standard-Event-Handler, die vom Plug-in verwendet werden.

$('input[name="adults"], input[name="children"]').on('keyup focusout', function() {
    $('input[name="attendees"]').valid();
});

Neue funktionierende DEMO: http://jsfiddle.net/ua0534dv/2/

Die Antwort von Sparky ist nicht vollständig: die adults und children erneut validieren müssen attendees wenn geändert.

Fügen Sie dies am Ende hinzu:

$('input[name=adults],input[name=children]').on('change', function(){
  $('input[name=attendees]').removeData("previousValue").valid();
});

Wie in den Kommentaren angedeutet, ist dies keine gute Praxis. Falls du es trotzdem machen willst:

$("#form2").validate({
    errorElement: "span",
        rules: {
        attendees: {
             equal: $("#form2 #adults").val() + $("#form2 #children").val();
        },              
        adults: {
             required: true,
             digits: true
        },              
        children: {
             required: true,
             digits: true
        }
    },
    messages: {
        attendees: "Enter the number of persons (including yourself)", 
        adults: "Enter number of adults", 
        children: "Enter number of childern"                
    }               
});