function validate() {
    let usernameRegex = /^([0-9a-zA-Z]{3,20})$/
    let passwordRegex = /^(\w{5,15}$)$/
    let emailRegex = /^\w+@(\w*[.]\w*)+$/
    let checked = false;
    let username = $('#username');
    let email = $('#email');
    let password = $('#password');
    let confirm = $('#confirm-password');
    let checkbox = $('#company');
    let companyInfo = $('#companyInfo')
    let companyNumber = $('#companyNumber');

    let submit = $('#submit')


    checkbox.on('change', function f() {
        if (companyInfo.css('display') === 'none') {
            companyInfo.css('display', '');
            checked = true;
        } else {
            companyInfo.css('display', 'none');
            checked = false;
        }
    })

    submit.on('click', function (event) {
        event.preventDefault();
        let isValid = true;

        if (!username.val().match(usernameRegex)) {
            username.css('border-color', 'red')
            isValid = false;
        } else {
            username.css('border-color', '')
        }
        if (!email.val().match(emailRegex)) {
            email.css('border-color', 'red')
            isValid = false;
        } else {
            email.css('border-color', '')
        }
        if (password.val().match(passwordRegex) && confirm.val() === password.val()) {
            password.css('border-color', '')
            confirm.css('border-color', '')
        } else {
            password.css('border-color', 'red')
            confirm.css('border-color', 'red')
            isValid = false;
        }

        if (checked) {
            if (+companyNumber.val() < 1000 || +companyNumber.val() > 9999) {
                isValid = false;
                companyNumber.css('border-color', 'red');
            } else {
                companyNumber.css('border-color', '');
            }
        }

        if (isValid) {
            $('#valid').css('display', '')
        } else {
            $('#valid').css('display', 'none')

        }
    })
}