JSFiddle - React, Tailwind, and code Playground

by ainop

HTML

<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.js"></script>
<script src="//cdn.jsdelivr.net/jquery.validation/1.14.0/additional-methods.js"></script>
<form action="">
    <input type="text" name="mail" placeholder="[email protected]"><br/>
    <input type="text" name="phone" placeholder="+7 999 999 99 99"><br/>
    <button>Go!</button>
</form>

JavaScript

$.validator.addMethod('phone', function(value, element) {
    if (this.optional(element)) {
        return /^\+7 \d\d\d \d\d\d \d\d \d\d/.test(value);
    }
}, 'It doesn\'t seem like valid phone number');

$('form').validate({
    debug: true,
    onkeyup: false,
    onclick: false,
    onfocusout: false,
    rules: {
        mail: {
            require_from_group: [1, 'input'],
            email: true
        },
        phone: {
            require_from_group: [1, 'input'],
            phone: true
        }
    }
});