demo of validate greaterThan

http://stackoverflow.com/q/17458874/312208

by ryleyb

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<form id="contact-form">
    <fieldset>
        <div class="control-group">
            <label class="control-label" for="beg_inv">Beginning</label>
            <div class="controls">
                <input class="input-80" name="beg_inv" type="text" id="beg_inv">
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="end_inv">End</label>
            <div class="controls">
                <input class="input-80" name="end_inv" type="text" id="end_inv">
            </div>
        </div>
    </fieldset>
    <input type="submit">
    <div id="errors"></div>
</form>

CSS

.error {
    color: red;
}

JavaScript

$.validator.addMethod(
    "greaterThan",
  function (value, element, params) {
    var target = $(params).val();
    var isValueNumeric = !isNaN(parseFloat(value)) && isFinite(value);
    var isTargetNumeric = !isNaN(parseFloat(target)) && isFinite(target);
    if (isValueNumeric && isTargetNumeric) {
        return Number(value) > Number(target);
    }

    if (!/Invalid|NaN/.test(new Date(value))) {
        return new Date(value) > new Date(target);
    }

    return false;
  },
    'Must be greater than {0}.');

$('#contact-form').validate({
    rules: {
        beg_inv: {
            greaterThan: "#end_inv"
        }
    },
    errorLabelContainer: '#errors',
    wrapper: 'li',
    submitHandler: function () {
        alert("successful submit");
        return false;
    }
});