Wtyczka jQuery Validate, wymagane jest jedno z dwóch pól

Question

Mam formularz z 2 polami; nr telefonu komórkowego i nr telefonu

co najmniej jedno z pól musi zostać wypełnione, ale można je wypełnić.

Potrzebuję sprawdzania poprawności jquery, aby rzucić błąd, jeśli żaden z nich nie jest wypełniony tylko.

udało mi się osiągnąć to z:

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

jednak, jeśli tylko jedno pole jest puste, to pole nadal dostaje „ważny” klasę, która nie ma jak mój poprawny css ma zieloną granicę (więc puste pole wciąż otrzymuje zieloną ramkę)

więc: jak uzyskać puste pole (pod warunkiem, że druga ma wartość), aby nie uzyskać prawidłowej klasy, a zatem zielonej granicy?

Answer 1

Używając the optional additional-methods.js file, istnieje metoda o nazwie require_from_group, która wykonuje dokładnie to, o co prosisz. (Należy użyć przynajmniej wersji 1.11.1 wtyczki w celu uniknięcia błędów przeszłości.)

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

Parametr 1 jest ilu z grupy są wymagane. W znacznikach HTML pola w grupie muszą zawierać class pasujący do class określony w drugim parametrze.

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

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

Mój przykład pokazuje również opcję groups które łączy w sobie wiele komunikatów o błędach w jednym.

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() == '' 
        } 
       } 
      } 
}