使用ajax从php页面上传文件和文本并存储在mysql中

Question

Hi i'm currently developing a php page which has an file upload feature. my form sends over 2 hidden values which is an order id and sender id and the file. I have to use ajax as i can't make it refresh after upload. The file upload has to be in my upload/files folder and i need to store the order id , sender id and filename in mysql.My ajax is getting the order id and sender id when i serialize but not the file. i tried seraching on this site for solutions and came acrross FormData object way to no success and also few other methods. the error in my console is always undefined sender_id, file order_id. It doesnt get the values from the html form. Thanks for helping.
MY php, html form

<form method="POST " id="form1" name="form1" enctype='multipart/form-data' >
            <input type="hidden" name="sender_id" value="<?php echo $_SESSION['user_session']?>">
            <input type="hidden" name="order_id" value="<?php echo $_GET['oid']?>">

                <?php //echo var_dump($sellerinfo);?>

            <div>
                 <div>
                     <textarea name="comments" placeholder="Leave Comments Here..." style="width:800px; height:100px;"></textarea>
                     <div class="row">
                     <input type="file" id="file" name="fileupload">
                         <input type="reset" value="Reset">
                         <a type="file"  href=""  class="button" id="fileupload" name="fileupload"> UPLOAD FILE </a>
                        <br>
                         <a id="comment" href=""  class="button">Post</a>
                         <input type="reset" value="Reset">

            </form>

File.js (ajax file)

$("#fileupload").click(function(e){
alert("inside ajax");
var formData = $("#form1").serialize()
alert(formData);
var formData = new FormData();
var file_data = $('#file').prop('files')[0];
formData.append('file', file_data);

alert(formData);

$.ajax({
    url: '../modules/Comment/fileupload.php',
    type: 'POST',
    dataType:"json",
    data: formData,
    async: false,
    cache: false,
    contentType: false,
    processData: false,
    error: function (result) {
        console.log(result);
        alert('ERROR RUNNING INSERTSCRIPT');
    },

    success: function (result) {
        alert(result)
        if (result['result'] == true) {
            alert("success");
            order_id = document.form1.order_id.value;
            $('#comment_logs').load("../modules/comment/file_logs.php?",{oid:order_id} );


        }
        else if (result['result'] == false) {
            alert('ERROR');
        }
    },

});
});

My php script that is supposed to upload and insert data inside database.

 <?php
if (session_status() == PHP_SESSION_NONE) {
session_start();
}
require('commentclass.php');
$connect = new connect(); // new connect class OBJECT

$conn = $connect->get_connection(); // getting Connection from Connect     Object

$sender_id=$_POST['sender_id'];
$order_id=$_POST['order_id'];
$Filename=basename( $_FILES['Filename']['name']);
define ('SITE_ROOT', realpath(dirname(__FILE__)));

if ( 0 < $_FILES['file']['error'] ) {
    echo 'Error: ' . $_FILES['file']['error'] . '<br>';
}
else {
if(move_uploaded_file($_FILES['file']['tmp_name'], '../../uploads/files/' .      $_FILES['file']['name'])) ;
    {
        echo "The file " . basename($_FILES['Filename']['name']) . " has  been uploaded, and your information has been added to the directory";
        $sql = "INSERT INTO files(order_id,send_by,file_name) VALUES ('" .  $order_id . "','" . $sender_id . "','" . $Filename . "')";
        $result = mysqli_query($conn, $sql);
        $data = array();

        if ($result) {
            $data['result'] = true;

           echo json_encode($data);
                 }
        else
            {
            $data['result'] = true;

                echo json_encode($data);
            }


                  }
    }
?>

Sorry for the long post, hope someone can help . Thanks in advance