jQuery sprawdzanie poprawności mniej niż

Question

Próbuję napisać "Mniej niż" weryfikator dla jQuery. Chcę porównać jedno pole tekstowe na inny, więc jeśli mam:

<input type="text" id="value1" /> <input type="text" id="value2" /> 

chcę mój walidator wyglądać

$('#myForm').validate({rules: { value1: { lessThan: "#value2" } } }); 

Próbowałem to, ale nie mogę zmusić go do pracy:

$.validator.addMethod('lessThan', function(value, element, param) { 
    var i = parseInt(value); 
    var j = parseInt($(param).val()); 
    return i >= j; 
}, "Less Than"); 

Jeszcze jedno pytanie: gdzie powinienem umieścić ten kod? W $ (document) .ready lub tylko w tagu?

Answer 1

Jestem idiotą. Napisałem kilka liter w moim prawdziwym kodzie i zepsułem ten.optional (element), który widzę w wielu metodach walidatora. Oto funkcja pracy:

$.validator.addMethod('lessThanEqual', function(value, element, param) { 
    if (this.optional(element)) return true; 
    var i = parseInt(value); 
    var j = parseInt($(param).val()); 
    return i <= j; 
}, "The value {0} must be less than {1}"); 

Oto skrócona wersja

$.validator.addMethod('lessThanEqual', function(value, element, param) { 
    return this.optional(element) || parseInt(value) <= parseInt($(param).val()); 
}, "The value {0} must be less than {1}"); 

Teraz muszę dowiedzieć się, jak ponownie uruchomić sprawdzanie poprawności dla pola 1 przy zmianie pole2.

Answer 2

Myślę, że możesz to zrobić bez pisania własnej metody sprawdzania poprawności.

$('#myForm').validate({ 
    rules: { 
     value1: { 
      maxlength: $('#value2').val().length 
     } 
    } 
}); 

$('#value2').change(function() { 
    $('#value1').rules('remove', 'maxlength').rules('add', { 
     maxlength: $('#value2').val().length 
    }); 
}); 

lub nawet lepiej bez powielania kodu

function getRule() { 
    return { 
     maxlength: $('#value2').val().length 
    }; 
} 

$('#myForm').validate({ 
    rules: { 
     value1: getRule() 
    } 
}); 

$('#value2').change(function() { 
    $('#value1').rules('remove', 'maxlength').rules('add', getRule()); 
}); 

Answer 3

można wstawić w dowolnej metody sprawdzania dokumentu gotowego bloku, tak jak pokazano poniżej.

$().ready(function() { 

    $.validator.addMethod("lessThan", 
     function(value, element, param) { 
      var i = parseFloat(value); 
      var j = parseFloat(param); 
      return (i < j) ? true : false; 
     } 
    ); 

}); 

Starałem się zachować tę prostotę, aby można było ją zmodyfikować. Jeśli metoda nazywa się "lessThan", powinna to zrobić. Jeśli twoja metoda faktycznie wykonuje "mniej niż lub równy", rozważ bardziej odpowiednią nazwę.

Należy pamiętać, że używam również parseFloat, co pozwala na większą elastyczność metody niż parseInt.

Z poziomu weryfikatora użyłeś go poprawnie; więc na potwierdzenie, powiedzmy, mniej niż 10:

$('#myForm').validate({ rules: { value1: { lessThan: "10"}} }); 

Powodzenia!