jQuery Validate - thiết lập quy tắc kiện dựa trên người dùng lựa chọn

Question

Có thể dễ dàng thiết lập một quy tắc với điều kiện jQuery xác nhận,

một cách đơn giản tôi đang cố gắng thêm một số logic mà nói, nếu hộp kiểm 'A' được đánh dấu - sau đó trường 'A' phải được hoàn thành, nếu hộp kiểm 'B' hoàn thành thì các trường 'B1' & 'B2' phải được hoàn tất.

ví dụ: nếu hộp kiểm có tên 'paypal' được chọn - thì trường có tên 'paypal_address' phải được hoàn thành.

lý hiện có của tôi là như sau:

<script type="text/javascript"> 
$(document).ready(function() { 

$('#checkout-form').validate({ 
    rules: { 
     first_name: { 
      minlength: 2, 
      required: true 
     }, 
     last_name: { 
      minlength: 2, 
      required: true 
     }, 
     address_1: { 
      minlength: 2, 
      required: true 
     }, 
     address_2: { 
      minlength: 2, 
      required: true 
     }, 
     post_code: { 
      minlength: 2, 
      required: true 
     },    
     email: { 
      required: true, 
      email: true 
     }, 
     terms: { 
      required: true, 
     } 
    }, 
    errorPlacement: function(error, element) { 
     element.addClass('error'); 
    },   
    highlight: function (element) { 
     $(element).addClass('nonvalid') 
      .closest('.form-group').removeClass('error'); 
    }, 
    success: function (element) { 
     //element.addClass('valid') 
      //.closest('.form-group').removeClass('error'); 
      element.remove('error'); 
    } 
}); 

CẬP NHẬT

Sử dụng phương pháp dưới đây từ Rohit tôi đã gần như đã làm việc này một cách hoàn hảo .. hình thức của tôi có ba hộp kiểm (chỉ có một có thể được chọn) 1. Paypal 2. Ngân hàng 3. Kiểm tra/Kiểm tra

Nếu Paypal được chọn (theo mặc định) thì chỉ có 'paypal_email_address' fie Nếu cần, nếu Ngân hàng được chọn thì các trường 'account_number' & 'sort_code' được yêu cầu & cuối cùng nếu Kiểm tra được đánh dấu là 'check_payable_field' là bắt buộc.

// Tôi đã có này cho đến nay $ (".paymentMethod") .Trên ("click", function() {var PAYMENT_METHOD = $ (this) .val();

if (payment_method == 'paypal') { 
    paypal_checked = true; 
    } else if (payment_method == 'bank-transfer') { 
    bank_checked = true; 
    paypal_checked = false; 
    } else if (payment_method == 'cheque') { 
    cheque_checked = true; 
    paypal_checked = false; 
    } 

});

Answer 1

jQuery Validate thực sự hỗ trợ trực tiếp này, sử dụng dependency expressions.

Tất cả bạn cần làm là thay đổi tùy chọn Validate của bạn như thế này:

$('#myform').validate({ 
    rules: { 
     fieldA: { 
      required:'#checkA:checked' 
     } 
    } 
}); 

Vậy là xong!

Answer 2

Chỉnh sửa: Tôi không hiểu câu hỏi đúng lúc đầu tiên, tôi xin lỗi vì điều đó: P Nhưng, đây là giải pháp có hiệu quả.

Những gì bạn có thể làm là kiểm tra hay không hộp kiểm được kiểm tra rồi thiết lập các quy tắc được yêu cầu cho paypal_address như vậy:

var checked = false; 
$("#paypalCheckbox").on("click", function() { 
     checked = $('#paypalCheckbox').is(':checked'); 
    }); 

Và sau đó trong các quy tắc bạn thể thêm:

paypal_address : { 
required: checked 
} 

Answer 3

Bạn có thể sử dụng phương pháp xác thực tùy chỉnh. Ví dụ:

jQuery.validator.addMethod("checkA", function(value, element) { 
    return YourValidationCode; // return true if field is ok or should be ignored 
}, "Please complete A"); 

sau đó sử dụng nó trong các quy tắc của bạn:

rules: { 
    .... 
    field_a: { 
     required: false, 
     checkA: true 
    }, 
    .... 
} 

Hãy xem: http://jqueryvalidation.org/jQuery.validator.addMethod/