JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/additional-methods.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.min.js"></script>
<form id="myform" method="POST">
    <div class="control-group" style="padding-bottom: 40px;">
        <input id="shopping_request_min_price" name="shopping_request[min_price]" placeholder="at least...." />
        <input id="shopping_request_max_price" name="shopping_request[max_price]" placeholder="no more than..." />
        <div id="price_msg"></div>
        <input type="submit" />
    </div>
</form>

JavaScript

$(document).ready(function () {

    $('#myform').validate({
        groups: {
            minStrict: ' "shopping_request[min_price]" "shopping_request[max_price]" '
        },
        errorPlacement: function (error, element) {
            if (element.attr("name") === "shopping_request[min_price]" || element.attr("name") === "shopping_request[max_price]") {
                return error.replaceAll($('#price_msg'));
            } else {
                return error.insertAfter($element);
            }
        },
        rules: {
            "shopping_request[min_price]": {
                number: true,
                min: 0,
                minStrict: {
                    depends: function (element) {
                        return $("#shopping_request_max_price").val().length > 0 && $("#shopping_request_min_price").val().length > 0;
                    }
                }
            },
                "shopping_request[max_price]": {
                number: true,
                min: 0,
                minStrict: {
                    depends: function (element) {
                        return $("#shopping_request_max_price").val().length > 0 && $("#shopping_request_min_price").val().length > 0;
                    }
                }
            }
        },
        highlight: function (element) {
            return $(element).closest(".control-group").removeClass("success").addClass("error").css('padding-bottom', '40px');
        },
        success: function (element) {
            return element.text("OK!").addClass("valid").closest(".control-group").removeClass("error").addClass("success").css('padding-bottom', '40px');
        },
        submitHandler: function (form) { // for demo
            alert('valid form submitted'); // for demo
            return false; // for demo
        }
    });

    jQuery.validator.addMethod('minStrict', (function (value, el) {
        return +($("#shopping_request_min_price").val()) <=...