2011-09-08 33 views
5

Tôi có một nút vô tuyến ẩn/hiển thị một div. Tất cả các yếu tố có thể nhìn thấy được "yêu cầu", nhưng thêm phớt lờ: ": ẩn" sau khi quy tắc xác nhận, không hoạt động ... Dưới đây là các mã:Trình xác thực jquery - Chỉ xác thực các phần tử hiển thị

<script type="text/javascript"> 

     $(document).ready(function(){ 
      $("#myForm").validate({ 
       rules: { 
        name: "required", 
        age: "required", 
        height: "required", 
        ignore: ":hidden" 
       } 
      }) 
     }); 

    </script> 
</head> 
<body> 
    <form id="myForm" name="myForm" method="post" action="" > 
     <input type="radio" name="checkAge" value="adult" onclick="$('#minorRequisites').hide();" />Adult<br/> 
     <input type="radio" name="checkAge" value="minor" onclick="$('#minorRequisites').show()" checked="checked"/>Child<br/> 
     Name <input id="name" name="name" type="text" /><br/> 
     <div id="minorRequisites"> 
      Age <input id="age" name="age" type="text" /><br/> 
      Height <input id="height" name="height" type="text" /><br/> 
     </div> 
     <input type="submit" /> 
    </form> 
</body> 

Tôi muốn để có thể gửi mẫu chỉ cho tên nếu "Người lớn" được chọn ... Bất kỳ ý tưởng nào? :)

Trả lời

10

Bạn có thể chỉ định dependency expressions trong required quy tắc của bạn để họ có bỏ qua các yếu tố nếu họ không thể nhìn thấy:

$("#myForm").validate({ 
    rules: { 
     name: "required", 
     age: { 
      required: "#age:visible" 
     }, 
     height: { 
      required: "#height:visible" 
     } 
    } 
}); 

Bạn có thể xem kết quả trong this fiddle.

EDIT:ignore cũng sẽ hoạt động, nhưng nó là một lựa chọn , không phải là một quy tắc , vì vậy bạn nên viết:

$("#myForm").validate({ 
    ignore: ":hidden", 
    rules: { 
     name: "required", 
     age: "required", 
     height: "required" 
    } 
}); 
+0

Cảm ơn !! : D Thật kỳ lạ khi bỏ qua: (": ẩn") không hoạt động, mặc dù .. – Caveman

+0

@Caveman, đó là vì 'ignore' là một tùy chọn, không phải là quy tắc. Tôi sẽ cập nhật câu trả lời của mình. –

+0

argh! Điều này giống như đặt một ';' vào cuối 'for' và tự hỏi tại sao nó không hoạt động ... Cảm ơn bạn rất nhiều! :) – Caveman

0

Vui lòng thử ignore: ":not(:visible)" thay vì ignore: ":hidden".

Các vấn đề liên quan