IMMREX7

<script>
function PreviewImage() {
    var oFReader = new FileReader();
    oFReader.readAsDataURL(document.getElementById("image").files[0]);
    oFReader.onload = function (oFREvent) {
        document.getElementById("uploadPreview").src = oFREvent.target.result;
    };
}
$(document).ready(function() {
    var i = 1;
    $(".add-row").click(function(){
        i++;  
        var markup = '<tr><td class="sno">'+i+'</td>\
                <td><input class="form-control" type="text" name="otheraccounts['+i+'][accName]" autocomplete="off"></td>\n\
                <td><input class="form-control" type="text" name="otheraccounts['+i+'][accNumber]" autocomplete="off"></td>\n\
                <td><input class="form-control" name="otheraccounts['+i+'][otherDetails]"></td>\n\
                <td style="text-align:right;vertical-align: middle;"><input type="button" required="required" class="btn btn-sm btn-danger" value="Delete" id="remove_row"></td></tr>';
            $("#optional_list").append(markup);
    });
    $('#optional_list').on('click', 'input[type="button"]', function () {
        $(this).closest('tr').remove();
         i = $('.sno:last').text();
         
    });
    
    $('select[name="idDepartment"]').on('change', function() {
        var departmentID = $(this).val();
        if(departmentID) {
            $.ajax({
                url: "<?php echo e(url('/school/departments')); ?>"+'/' +departmentID + "/designations",
                type: "GET",
                dataType: "json",
                success:function(data) {
                    $('#idDesignation').empty();
                    $('#idDesignation').append('<option value="">-- Select Designation --</option>');
                    $.each(data, function(key, value) {
                       $('#idDesignation').append('<option value="'+key+'">'+value+'</option>');

                    });
                }
            });
        }else{
            $('select[name="idDesignation"]').empty();
        }
    });
});
$('#employee_form').on('submit',function(e){
    $.ajaxSetup({
    header:$('meta[name="_token"]').attr('content')
});
 var formData =  new FormData($('#employee_form')[0]);
 $("#submit-btn").innerHTML = '<i class="fa fa-spinner fa-spin"></i>Please Wait';
 // $("#submit-btn").prop('disabled', true);
    $.ajax({
        type:"POST",
        url: "<?php echo e(url('school/employees')); ?>",
        processData: false,
        contentType: false,
        data:formData,
        dataType: 'json',
        success:function(data){
            if( data[Object.keys(data)[0]] === 'SUCCESS' ){
              //  $("#submit-btn").prop('disabled', true);
                $("#submit-btn").innerHTML = '<i class="fa fa-spinner fa-spin"></i>Please Wait';
                window.location = "<?php echo e(url('school/employees')); ?>";
            }
            else {                  //False Case: With error msg
            $("#msg").html(data);   //$msg is the id of empty msg
            }

        },

        error: function(data){
                    if( data.status === 422 ) {
                    //    $("#submit-btn").prop('disabled', false);
                    $("#submit-btn").innerHTML = 'SAVE';

                        let errors = data.responseJSON.errors;
                        let errorMessage = 'Validation Errors:<br>';
                        $.each(errors, function(field, messages) {
                            errorMessage += `<strong>${field}:</strong> ${messages.join(', ')}<br>`;
                        });
                        $('#errors').html( '<div class="alert alert-danger">'+errorMessage+'</div>');
                        var errorHtml = '<div class="alert alert-danger"><ul>';
                           $('#formerrors').html(errorHtml);
                                if(errors['enrollmentNo']=== undefined){
                                    $( '#ecnoerror' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['enrollmentNo']+'</strong></span>';
                                   $( '#ecnoerror' ).html( errorname );
                                }
                                if(errors['firstName']=== undefined){
                                    $( '#fnameerror' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['firstName']+'</strong></span>';
                                   $( '#fnameerror' ).html( errorname );
                                }
                                if(errors['lastName']=== undefined){
                                    $( '#lnameerror' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['lastName']+'</strong></span>';
                                   $( '#lnameerror' ).html( errorname );
                                }
                                if(errors['idFinancialYear']=== undefined){
                                    $( '#sessionerror' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['idFinancialYear']+'</strong></span>';
                                   $( '#sessionerror' ).html( errorname );
                                }
                                if(errors['studentDob']=== undefined){
                                    $( '#doberror' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['studentDob']+'</strong></span>';
                                   $( '#doberror' ).html( errorname );
                                }
                                if(errors['gender']=== undefined){
                                    $( '#gendererror' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['gender']+'</strong></span>';
                                   $( '#gendererror' ).html( errorname );
                                }
                                if(errors['idClass']=== undefined){
                                    $( '#classerror' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['idClass']+'</strong></span>';
                                   $( '#classerror' ).html( errorname );
                                }
                                if(errors['idSection']=== undefined){
                                    $( '#sectionerror' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['idSection']+'</strong></span>';
                                   $( '#sectionerror' ).html( errorname );
                                }
                                if(errors['studentType']=== undefined){
                                    $( '#stdtypeerror' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['studentType']+'</strong></span>';
                                   $( '#stdtypeerror' ).html( errorname );
                                }
                                if(errors['bloodGroup']=== undefined){
                                    $( '#bloodgrp' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['bloodGroup']+'</strong></span>';
                                   $( '#bloodgrp' ).html( errorname );
                                }
                                if(errors['address']=== undefined){
                                    $( '#resaddress' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['address']+'</strong></span>';
                                   $( '#resaddress' ).html( errorname );
                                }
                                if(errors['city']=== undefined){
                                    $( '#rescity' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['city']+'</strong></span>';
                                   $( '#rescity' ).html( errorname );
                                }
                                if(errors['pincode']=== undefined){
                                    $( '#respincode' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['pincode']+'</strong></span>';
                                   $( '#respincode' ).html( errorname );
                                }
                                if(errors['idState']=== undefined){
                                    $( '#resstate' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['idState']+'</strong></span>';
                                   $( '#resstate' ).html( errorname );
                                }
                                if(errors['contactPerson']=== undefined){
                                    $( '#contactperson' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['contactPerson']+'</strong></span>';
                                   $( '#contactperson' ).html( errorname );
                                }
                                if(errors['contactPersonMobile']=== undefined){
                                    $( '#contactPersonMobile' ).empty();
                                }else{
                                   errorname = '<span class="help-block"><strong>'+errors['contactPersonMobile']+'</strong></span>';
                                   $( '#contactPersonMobile' ).html( errorname );
                                }
                                
                    }
            }
    });
    return false;
});
</script>