   <!-- BEGIN: Page JS-->
   <script>
    'use strict';
    const editForm = document.querySelector('#editForm');    
    const login              = "<%= i18n.__('login') %>",
           emailValid        = "<%= i18n.__('emailValid') %>",
           passwordValid     = "<%= i18n.__('passwordValid') %>",
           filedRequired     = "<%= i18n.__('filedRequired') %>";
    document.addEventListener('DOMContentLoaded', function (e) {
    const status = jQuery(editForm.querySelector('[name="status"]'));

    (function () {
        // Form validation for Add new record
        if (editForm) {
            const fv = FormValidation.formValidation(editForm, {
                fields: {
                    email    : {
                        validators: {
                        notEmpty: {
                            message: filedRequired
                        },
                        emailAddress: {
                            message: emailValid
                        }
                        }
                    },

                    '[ar]'   : {
                        validators: {
                        notEmpty: {
                            message: filedRequired
                        },
                        }
                    },

                    '[en]'   : {
                        validators: {
                        notEmpty: {
                            message: filedRequired
                        },
                        }
                    },
                    translateId: {
                        validators: {
                            callback: {
                                message: filedRequired,
                                callback: function (input) {
                                    // Get the selected options
                                    const options = status.select2('data');
                                    return options[0].id != "" ;
                                },
                                
                            },
                        },
                    },
                
                    status: {
                        validators: {
                            callback: {
                                message: filedRequired,
                                callback: function (input) {
                                    // Get the selected options
                                    const options = status.select2('data');
                                    return options[0].id != "" ;
                                },
                                
                            },
                        },
                    },

                    password : {
                        validators: {
                        notEmpty: {
                            message: filedRequired
                        },
                        stringLength: {
                            min: 6,
                            message: passwordValid
                        }
                        }
                    },

                    },
                    plugins: {
                    trigger: new FormValidation.plugins.Trigger(),
                    bootstrap5: new FormValidation.plugins.Bootstrap5({
                        eleValidClass: '',
                        rowSelector: '.mb-3'
                    }),
                    submitButton: new FormValidation.plugins.SubmitButton(),
                  //  defaultSubmit: new FormValidation.plugins.DefaultSubmit(),
                    autoFocus: new FormValidation.plugins.AutoFocus()
                    },
                    init: instance => {
                    instance.on('plugins.message.placed', function (e) {
                        if (e.element.parentElement.classList.contains('input-group')) {
                        e.element.parentElement.insertAdjacentElement('afterend', e.messageElement);
                        }
                    });
                }
            }).on('core.form.valid', function() {
                submitAddForm()
            });;
        }

        status.select2().on('change.select2', function () {
                    // Revalidate the color field when an option is chosen
            fv.revalidateField('status');
        });

        //  Two Steps Verification
        const numeralMask = document.querySelectorAll('.numeral-mask');
        // Verification masking
        if (numeralMask.length) {
            numeralMask.forEach(e => {
                new Cleave(e, {
                numeral: true
                });
            });
        
        }
    })();
    });
</script>

<!-- Page JS -->
