JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<form action="" id="frmLogin" name="frmLogin" method="post">
    <input type="text" id="text1" name="text1" placeholder="text1">
    <input type="text" id="text2" name="text2" placeholder="text2">
    <input type="text" id="text3" name="text3" placeholder="text3">
    <input type="submit" id="submit" value="Submit" data-mini="true">
</form>

JavaScript

$('#frmLogin').validate({
    onfocusout: false,
    onkeyup: false,
    ignore: "",
    rules: {
        text1: {
            required: true
        },
        text2: {
            required: true,
            TotalSum: true
        }
    },
    showErrors: function (errorMap, errorList) {
        var messages = "";
        var check = 0;
        $.each(errorList, function (index, value) {
            check = 1;
            var id = $(value.element).attr('id');
            messages += (index + 1) + ". " + value.message + "\n";
        });

        messages = "Please correct following errors \n" + messages;
        if (check == 1) {
            alert(messages);
        }
    },
    submitHandler: function () {
        alert('Success!!!');
    },
    messages: {
        text1: {
            required: "Please enter text1"
        },
        text2: {
            required: "Please enter text2"
        }
    }
});

jQuery.validator.addMethod("TotalSum", function () {

    var arr = ['text2', 'text3'];
    var Sum = 0;
    for (var i = 0; i < arr.length; i++) {
        var test = arr[i];
        var sum2 = $('#' + test).val();
        if (sum2 == null || sum2 == 'NaN' || sum2 == '') sum2 = 0;

        Sum = parseInt(sum2) + parseInt(Sum);
    }
    if (Sum != 100) {
        return false;
    } else return true;
}, "Sum of Text2 and Text3 must equal 100%");