jquery validation add đầu vào bắt buộc động

Question

Tôi hiện đang sử dụng các bassistance jquery validation hoặc plugin jqueryvalidation (họ đổi tên nó) và tôi có nó xác nhận một hình thức như vậy:

if($.fn.validate) { 
     $("#frmNewOrder").validate({ 
      rules: { 
       txtAmount: { 
        required: true, 
        digits: true 
       }, 
       ddlAccount: { 
        required: true 
       }, 
       ddlBank: { 
        required: true 
       } 
      } 
     }); 
    } 

Bây giờ tùy thuộc vào số tiền tôi cần phải yêu cầu hoặc không phải là một trường bổ sung một danh sách thả xuống và tùy thuộc vào danh sách thả xuống đó một đầu vào văn bản khác. vì vậy nó giống như:

if($('#txtAmount').val() >= 10000){ 
    //add ddlReason required 
} 

if($('#ddlReason').val() == 'o'){ 
    //add txtReason required 
} 

Tôi đã thử thêm lớp css 'bắt buộc' như các trường khác nhưng tôi lấy nó nếu chúng không nằm trong quy tắc thì nó không hoạt động? Tôi đã thử thêm các quy tắc như sau:

$("#ddlReason").rules("add", { 
     required: true}); 

và điều đó cũng không hoạt động. bất kỳ đề xuất?

EDIT: Đây là link để xác thực jquery mà tôi đang sử dụng. nếu tôi sử dụng quy tắc bên ngoài nó mang lại cho lỗi này:

Uncaught TypeError: Cannot read property 'settings' of undefined 

on line 124:

var settings = $.data(element.form, 'validator').settings; 

và sử dụng những gợi ý tôi đã nhìn thấy ở những nơi khác tôi đã làm mà đây là những gì gây ra lỗi :

var defaultrules = { 
    txtAmount: { 
     required: true, 
     digits: true 
    } 
} 

if($.fn.validate) { 
    $("#frmNewOrder").validate(); 
    addRules(defaultrules); 
} 

EDIT 2: đây là đánh dấu html, hy vọng điều này sẽ giúp ích.

<form id="frmNewOrder" name="frmNewOrder" action="" method="post"> 
<label>Amount</label> 
<input type="text" name="txtAmount" id="txtAmount" class="required" /> 
<button id="calculate" type="button">Calculate</button> 
<div id="dvreason" style="display:none;"> 
    <select id="ddlReason" name="ddlReason"> 
     <option></option> 
     <option value="i">Option 1</option> 
     <option value="o">Other</option> 
    </select> 
    <div id="dvother" style="display:none"> 
     <label>Other reason</label> 
     <input type="text" name="txtOther" id="txtOther" /> 
    </div> 
</div> 
<input type="submit" name="send" id="send" value="Send" /> 
</form> 

Answer 1

phải đối mặt với vấn đề tương tự với nó,

trên thực tế những gì bạn sẽ nhận thấy là validator đó là undefined tại dòng 124, tức là không có dụ validator gắn liền với hình thức

nếu bạn kiểm tra phương thức validate bạn thấy rằng nếu validator là undefined nó sẽ tạo ra một cái mới

var validator = $.data(this[0], 'validator'); 
     if (validator) { 
      return validator; 
     } 

     // Add novalidate tag if HTML5. 
     this.attr('novalidate', 'novalidate'); 

      //HERE it is creating a new one using the constructor 
     validator = new $.validator(options, this[0]); 
     $.data(this[0], 'validator', validator); 

Rõ ràng phương pháp rules giả validator rằng đã có trong đối tượng biểu mẫu, do đó, từ sự hiểu biết của tôi và vì validate trả về phiên bản trình xác thực, bạn có thể gọi validate và sau đó nối thêm các quy tắc bổ sung vào trình xác thực trả lại settings.rules đối tượng và chạy lại không thực tế lắm.

Các giải pháp khác sẽ được chỉ đơn giản là thêm các quy tắc bổ sung vào đối tượng các quy tắc ban đầu trước khi gọi validate

Vì vậy, trong trường hợp của tôi, tôi muốn các lĩnh vực đầu vào để được xác nhận như số tuy nhiên tôi không muốn Google Chrome biến nó thành trường số (chỉ cần thử trong Chrome để xem ý tôi là gì, điều này có vấn đề bỏ qua xác thực số loại trong trường hợp người dùng nhập theo cách thủ công và trong trường hợp của tôi, người dùng có thể nhập số theo cách thủ công)

ví dụ mã:

var customRule = {number: true}; 

//suppose populateValidateRules() fills your initial rules, which is my case at least 
var validationRules = populateValidateRules(); 

validationRules["rules"].fieldToBeDynamicallyModifiedForValidation= customRule; 

$(formId).validate(validationRules); 

Hope this helps

Answer 2

Tôi muốn nhận được thông báo lỗi tương tự như tốt và nhận ra rằng tôi nên gọi validate() về hình thức đầu tiên trước khi tôi gọi rules() trên lĩnh vực đầu vào cá nhân. Hành vi này là documented.

$('#form').validate({ 
    rules: { 
    email: { 
     email: true 
    } 
    } 
}); 

$('#email').rules('add', { 
    required: true 
}); 

Điều này có thể không phải là câu trả lời cho vấn đề OP, nhưng tôi gửi bài này để giúp những ai đã tìm kiếm và nhấp jquery validation Cannot read property settings of undefined trang này.

Nhờ gợi ý được đưa ra bởi @nsawaya!

Answer 3

của họ là một vấn đề trong khi nhận được các yếu tố bổ sung năng động bằng cách sử dụng id vì vậy nó được làm việc nếu bạn sử dụng bộ chọn thuộc tính ví dụ như vậy thêm thuộc tính data="ddlReason" và làm cho nó như thế này:

$("input[data='ddlReason']").rules("add", { 
     required: true 
});