IFormFile in model is always null

Question

I have a file upload form to be submitted.And Below is the ViewModel and it's DataAnnotations. Upon the form submit, the ModelState is getting false. When checked for File property in the ViewModel, it is null. Despite I kept the enctype="multipart/form-data, I'm still getting null.

Could anyone please help me.

public class ExcelUploadViewModel
    {

        /// <summary>
        /// Gets or Sets the FileName
        /// </summary>
        [Required(ErrorMessage = "FileName is required")]
        public string FileName { get; set; }

        [Required(ErrorMessage = "File is required")]
        [DataType(DataType.Upload)]
        public IFormFile File { get; set; }
   }

Controller.cs

[HttpPost]
    public async Task<IActionResult> UploadExcel(ExcelUploadViewModel excelUploadModel)
    {
        if (ModelState.IsValid)
        {
            // HttpResponseMessage response;
            TransactionResultBase transactionResultBase = new TransactionResultBase();
            IFormFile file = Request.Form.Files[0];
        }
    }

And FormUpload.cshtml

<div align="left">
            <form id="uploadForm" enctype="multipart/form-data" name="uploadForm" asp-action="UploadExcel" method="post" >

                <div class="form-group form-group-lg form-group-sm row " >
                    <div class="col-sm-12 col-md-10 col-lg-10 uploadDiv" style="display: flex !important">
                        <label asp-for="FileName" class="col-sm-12 col-md-10 col-lg-10" style="font-size: 15px; max-width: fit-content ">File Name :</label>
                        <input asp-for="FileName" class="form form-control fileName"
                               type="text"
                               name="fileName"
                               placeholder="Enter your file name"
                               id="fileName" />
                        <span asp-validation-for="FileName" class="text-danger"></span>
                        <input asp-for="File" required class="form-control file" type="file" placeholder="File Name" id="file" name="uploadFile" />
                    </div>
                </div>
                <small>Please upload .xls or .xlxs or json or xml formatted files only</small>
                <div class="form-group form-group-lg form-group-sm row">
                    <div class="col-sm-12 col-md-10 col-lg-10">
                        <input type="submit" class="btn btn-primary" name="submit" id="fileUploadButton" value="Upload" />
                        <input type="reset" class="btn btn-Gray" name="result" id="resetButton" value="Reset" />
                    </div>
                </div>
            </form>
        </div>

Answer 1

Tag helpers produce id and name attiribute according to the model. So dont use both tag helpers and name attiribute at the same time.

If you want to use tag helper asp-for is enough.If you want to use "name" attiribute then you should use it according to your model and property name. In this situation since you used name attiribute for file input name="uploadFile" your model cannot determine which property is that, so you should correct it name="File"

Be careful it changes if you are using viewmodel in the view.