$_files array is empty on submit with javascript

Question

I am facing issue while submitting form, i am getting empty $_FILES array. I have javascript attached with this form where i m trying to upload images and other user inputs, with javascript i am getting empty array but on other hand if i submit form without attaching javascript so same form $_FILES array showing data normally..

here i am posting my form and javascript can anyone help me to figure out whats wrong in my javascript which prevents post to send $_FILES array.. ?

script.js

$(function(){
"use strict";
$('.form1').on('submit', function( event ){
    event.preventDefault();

    var form = $(this); 
    submitForm(form);   
    });
function submitForm(form){
    "use strict";
    $("button").click(function(){
        $("#loader").html('<img src="img/ajax-loader.gif">');
    });

    $.ajax ({
            url: form.attr('action'),
            method: form.attr('method'),
            data: form.serialize(),
            success: function(response) {
                response = $.parseJSON( response );

                if(response.success){       
                        if(!response.signup){
                            setTimeout(function(){
                            $("#loader").html(response.message);    
                            window.location = response.url; 
                        }, 1000);

                }
                    else{
                    $("#loader").html(response.message);}
                }
                else if(response.error){
                    $("#loader").html(response.message);

                } 
                else if(response.missing_fields){
                    $("#loader").html(response.message);

                }   

            }

        });
}

Here is my HTML Code (add_user.php):

<form method="POST" action="/pms/admin/user-register.php" class="form1" enctype='multipart/form-data'>
                <div class="row">
                <div class="float-right col-md-12" ><span>User Details:</span><a href="users.php"><span class="btn btn-danger float-right">Back</span></a></div>

                </div>
                <hr>
                   <div class="row"> 
                      <div class="form-group col-md-6">
                        <label  for="firstName">First Name:</label>
                        <input type="text" class="form-control" id="firstName" name="firstName" placeholder="Enter First Name">

                      </div>
                      <div class="form-group col-md-6">
                        <label for="lastName">Last Name:</label>
                        <input type="text" class="form-control" name="lastName" id="lastName" placeholder="Enter Last Name">
                      </div>
                  </div>
                    <div class="row"> 
                      <div class="form-group col-md-6">
                        <label  for="firstName">Mobile Number:</label>
                        <input type="text" class="form-control" id="mobNumber" name="mobNumber" placeholder="Enter Mobile No">

                      </div>
                      <div class="form-group col-md-6">
                        <label for="lastName">Email Address:</label>
                        <input type="email" class="form-control" name="email" id="email" placeholder="Enter Email">
                      </div>
                  </div>

                    <div class="row"> 
                        <div  class="form-group col-md-6">
                        <div class="filediv">
                           <label for="lastName">User Documents:</label><br>
                           <input class="fomr-control-file" type="file" name="files[]" id="file" multiple><br><br>
                           <input type="button" id="add_more" class="btn btn-sm btn-secondary" value="+ Add More Files"/>
                        </div>
                        </div>
                    </div>
                  <br>
                  <h6>Login Details:</h6><hr>
                   <div class="row"> 
                      <div class="form-group col-md-6">
                        <label  for="firstName">User Type:</label>
                        <select class="form-control" name="userType">
                            <option value="user-type" disabled selected>Select User Type..</option>
                            <option value="administrator">Administrator</option>
                            <option value="user">Regular User</option>
                        </select>
                      </div>
                      <div class="form-group col-md-6">
                        <label for="lastName">User Name:</label>
                        <input type="text" class="form-control" name="userName" id="userName" placeholder="Enter Last Name">
                      </div>
                  </div>    
                  <div class="row"> 
                      <div class="form-group col-md-6">
                        <label  for="firstName">Password:</label>
                        <input type="password" class="form-control" name="password" placeholder="Enter Password">

                      </div>
                      <div class="form-group col-md-6">
                        <label for="lastName">Repeat Password:</label>
                        <input type="password" class="form-control" name="cpassword"  placeholder="Renter Password">
                      </div>
                  </div>    

                  <button type="submit" class="btn btn-primary" name="submit" id="upload">Submit</button>
                      <div id="loader" style="margin-top:40px; position:relative; text-align:center;"></div>

                </form>