Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – JS form validation using ajax, for email validation

here i have a form email validation but its in server side i want it in client side (Real time Validation).

i want form validation for business email Checking. its nere accept gmail.com, yahoo, bing, yopmail , like public provides

 LtsCustomerRegistration.prototype.handleEvents = function () {
        var _this = this;
        $(".btn-next-step-1").click(function() {
            _this.step1Validation.validate().then(function (status) {
                if (status == 'Valid') {
                    var step1FormData = LtsMain.formSetData('#CustomerSignUpFormStep1');
                    _this.customerSignUp(step1FormData, function(res){
                        $('#customer_id_hidden').val(res.customerId);
                        _this.switchTabs(2);
                    }, 
                    function(res){
                        if(res.status === 'user_exist'){
                            $('#customer_email').parents('.form-group').find('.email-exists-validation-msg').removeClass('d-none');
                            $('#multi-step-form').animate({
                                scrollTop: 0
                            }, 1000);
                        } else if(res.status === 'invalid_email'){
                            $('#customer_email').parents('.form-group').find('.email-invalid-validation-msg').removeClass('d-none');
                            $('#multi-step-form').animate({
                                scrollTop: 0
                            }, 1000);
                        }
                    });
                }
            });
        });

this validation is Check the user email invalid or not, in the submit button Click
this pass to a method in symfony "customerSignUp"

here is validation is client side real time validation.

Tags:

2

Answers


  1. 0

    fullcode

    $(document).ready(function () {
    $('#customer_email').on('input', function () {
        var email = $(this).val();
        var emailRegex = /^[^s@]+@[^s@]+.[^s@]+$/;
        var isValid = emailRegex.test(email);
        if (isValid) {
            $('.email-validation-msg').addClass('d-none');
        } else {
            $('.email-validation-msg').removeClass('d-none');
        }
    });

    $(".btn-next-step-1").click(function () {
        var step1FormData = LtsMain.formSetData('#CustomerSignUpFormStep1');
        var email = $('#customer_email').val();
        var emailRegex = /^[^s@]+@[^s@]+.[^s@]+$/;
        var isEmailValid = emailRegex.test(email);

        if (!isEmailValid) {
            $('#customer_email').parents('.form-group').find('.email-invalid-validation-msg').removeClass('d-none');
            return;
        }

        _this.customerSignUp(step1FormData, function (res) {
            $('#customer_id_hidden').val(res.customerId);
            _this.switchTabs(2);
        }, function (res) {
            if (res.status === 'user_exist') {
                $('#customer_email').parents('.form-group').find('.email-exists-validation-msg').removeClass('d-none');
                $('#multi-step-form').animate({
                    scrollTop: 0
                }, 1000);
            } else if (res.status === 'invalid_email') {
                $('#customer_email').parents('.form-group').find('.email-invalid-validation-msg').removeClass('d-none');
                $('#multi-step-form').animate({
                    scrollTop: 0
                }, 1000);
            }
        });
    });
});
    Login or Signup to reply.
  2. 0

    Try This..

    LtsCustomerRegistration.prototype.handleEvents = function () {
    var _this = this;
    function validateEmailFormat(email) {
        // Regular expression for a simple email format
        var emailRegex = /^[^s@]+@[^s@]+.[^s@]+$/;
        return emailRegex.test(email);
    }

    $('#customer_email').on('keyup', function () {
        var email = $(this).val();
        var isValidFormat = validateEmailFormat(email);

        if (!isValidFormat) {
            // Show error message for invalid email format
            $(this).parents('.form-group').find('.email-invalid-validation-msg').removeClass('d-none');
        } else {
            // Hide error message if email format is valid
            $(this).parents('.form-group').find('.email-invalid-validation-msg').addClass('d-none');
        }
    });

    $(".btn-next-step-1").click(function () {
        _this.step1Validation.validate().then(function (status) {
            if (status == 'Valid') {
                var step1FormData = LtsMain.formSetData('#CustomerSignUpFormStep1');

                var email = step1FormData.customer_email;
                var isValidFormat = validateEmailFormat(email);

                if (!isValidFormat) {
                    $('#customer_email').parents('.form-group').find('.email-invalid-validation-msg').removeClass('d-none');
                    return; // Stop form submission if email format is invalid
                }

                _this.customerSignUp(step1FormData, function (res) {
                    $('#customer_id_hidden').val(res.customerId);
                    _this.switchTabs(2);
                }, function (res) {
                    if (res.status === 'user_exist') {
                        $('#customer_email').parents('.form-group').find('.email-exists-validation-msg').removeClass('d-none');
                        $('#multi-step-form').animate({
                            scrollTop: 0
                        }, 1000);
                    } else if (res.status === 'invalid_email') {
                    }
                });
            }
        });
    });
};
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search