HttpPostedFileBase is NULL  in controller Not Receiving the File Name!!

Summary of the problem I am having:

 HttpPostedFileBase is NULL  in controller Not Receiving the File Name!!

Error I am receiving:

HttpPostedFileBase is NULL  

My code:

<label class="file-upload" style="height: 0px;" ><img src="~/Image/Excel-Upload.png" /><input type="file" id="myfile" style="width: 24px; height:24px" 
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel"></label> 

<script>$('#myfile').on("change", function () {
var formdata = new FormData($('form').get(0));
CallService(formdata);});function CallService(file) {$.ajax({
        url: '@Url.Action("UploadAttendeeFile", "Attendee")',
        type: 'POST',
        data: file,
        cache: false,
        enctype: "multipart/form-data",
        processData: false,
        contentType: false,
        success: function (color) {
            ;
        },
        error: function () {
            alert('Error occured');
        }
    });
}</script>

 [HttpPost]
        public ActionResult UploadAttendeeFile(HttpPostedFileBase file)
        {
            // Why HttpPostedFileBase is giving NULL Value always
            //// ?????

            return View("AttendeesList");
        }