How to put condition if the following criteria does not match and my form should not submit

Question

I have put conditon to my form that one capital one small and 8 characters simply if criteria does not match my form should not be submit but here my form is submitted even this criteria does not match and showing me the success message. I dont know where is the problem.

My js/ajax code:

        $('#password_change_form').submit(function(e) {
        e.preventDefault();
        var saveThis = $(this);

        $.ajax({
            type: "POST",
            url: "/changepassword",
            data: $(saveThis).serialize(),
            success: function(data) {
                $(".success-messages").text("Heslo bylo úspěšně změněno").fadeIn();
                setTimeout(function(){
                    $(".success-messages").fadeOut('slow');
                },4000);
                $('#password_change_form').trigger("reset");


            },
            error: function (data) {
                $(".error-messages").text("Zadali jste špatné heslo").fadeIn();
                setTimeout(function(){
                    $(".error-messages").fadeOut('slow');
                },4000);
                $('#password_change_form').trigger("reset");
            }

        });
    }),

and validation rules on my form:

                      var FormValidation = function () {
        var e = function () {
            var e = $("#password_change_form"),r = $(".alert-danger", e), i = $(".alert-success", e);

            e.validate({
                errorElement: "span",
                errorClass: "help-block help-block-error",
                focusInvalid: !1,
                ignore: ":hidden",
                rules: {

                    new_password: { required: !0,password_validate:!0 },
                    password_confirmation: {
                        equalTo: "#new_password"
                    }

                },
                messages: {

                    new_password:{ required: "Zapomněli jste zadat nové heslo."},
                    password_confirmation:{ equalTo: "Hesla nesouhlasí."}

                },
                invalidHandler: function (e, t) {
                    i.hide(), r.show()
                },
                errorPlacement: function (e, r) {
                    r.is(":checkbox") ? e.insertAfter(r.closest(".md-checkbox-list,.checkbox-label, .md-checkbox-inline, .checkbox-list, .checkbox-inline"),r.closest(".checkbox").addClass("has-error")) : r.is(":radio") ? e.insertAfter(r.closest(".md-radio-list, .md-radio-inline, .radio-list,.radio-inline")) : e.insertAfter(r)
                },
                highlight: function (e) {
                    $('.help-block').html('');$(e).closest(".form-group").addClass("has-error")
                },
                unhighlight: function (e) {
                    $(e).closest(".form-group").removeClass("has-error")
                },
                success: function (e) {
                    e.closest(".form-group").removeClass("has-error")
                }
            })
        };
        return {
            init: function () {
                e();
            }
        }
    }();

    $(document).ready(function () {
        FormValidation.init();
        $.validator.addMethod("password_validate",function(value,element){
            return this.optional(element) || /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,16}$/i.test(value);
        },"Nové heslo musí obsahovat minimálnÄ› 8 znaků, jedno velké a malé písmeno a Äíslo. Prosím zkontrolujte, že vámi zadané heslo splňuje tyto podmínky.");
    });

I dont know where is the problem my form should not be submit if the criteria does not match but here its submitting the form.

Guys really needs your help here.

Answer 1

I suggest using Laravel validation for your form. https://laravel.com/docs/5.7/validation

This might also be useful: Laravel password validation rule