jQuery Validieren Plugin, eins von zwei Feldern ist erforderlich

Question

Ich habe ein Formular mit 2 Feldern; Handy-Nr. und Telefonnr.

Mindestens 1 der Felder muss ausgefüllt werden, aber beide können auch ausgefüllt werden.

Ich brauche jquery validate, um einen Fehler zu werfen, wenn keine von ihnen nur gefüllt werden.

Ich habe erreicht dies mit:

rules: { 
      mobile:{ 
       required: { 
        depends: function(element) { 
         return $("#regTelephone").val() === ''; 
        } 
       } 
      }, 
      telephone:{ 
       required: { 
        depends: function(element) { 
         return $("#regMobile").val() === ''; 
        } 
       } 
      } 
} 

jedoch, wenn nur ein Feld leer ist, dieses Feld wird nach wie vor die ‚gültig‘ Klasse, die will ich nicht als meine gültige CSS eine grüne Grenze hat (so erhält das leere Feld immer noch einen grünen Rand)

also: wie bekomme ich das Feld, das leer ist (vorausgesetzt, das andere hat einen Wert), um nicht die gültige Klasse und damit die grüne Grenze zu bekommen?

Answer 1

Mit the optional additional-methods.js file gibt es eine Methode namens require_from_group, die genau das tut, was Sie anfordern. (Sie müssen mindestens Version 1.11.1 des Plugins verwenden, um eine Vergangenheit Fehler zu vermeiden.)

rules: { 
    mobile:{ 
     require_from_group: [1, '.mygroup'] 
    }, 
    telephone:{ 
     require_from_group: [1, '.mygroup'] 
    } 
}, 
.... 

Der 1 Parameter ist, wie viele aus der Gruppe erforderlich sind. Im HTML-Markup müssen die Felder in Ihrer Gruppe einen class enthalten, der dem in Ihrem zweiten Parameter angegebenen Wert class entspricht.

<input type="text" class="mygroup" name="mobile" /> 
<input type="text" class="mygroup" name="telephone" /> 

Arbeits DEMO: http://jsfiddle.net/NfcxX/

Meine Demo zeigt auch die groups Option, die die mehrere Fehlermeldungen in einem kombiniert.

Answer 2

<input type="text" name="mobile" id="regMobile"> 
<input type="text" name="telephone" id="regTelephone"> 

rules: { 
      mobile:{ 
       required: { 
        depends: function(element) { 
         return $("#regTelephone").val() == '' 
        } 
       } 
      }, 
      telephone:{ 
       required: { 
        depends: function(element) { 
         return $("#regMobile").val() == '' 
        } 
       } 
      } 
}