I’m developing an ASP.NET Core 8.0 MVC application for an online shop. I’ve created a form to add new products, which includes an image upload feature. However, I’m encountering an issue where the form submission fails with an error

The Image field is required

even when I’ve selected an image file to upload.

Here are the relevant details:

Controller action (POST):

[HttpPost]
public async Task<IActionResult> Create(Products product, IFormFile image)
{
    if (ModelState.IsValid)
    {
        if (image != null)
        {
            var name = Path.Combine(_he.WebRootPath + "/images", Path.GetFileName(image.FileName));
            await image.CopyToAsync(new FileStream(name, FileMode.Create));
            product.Image = "images/" + image.FileName;
        }

        _db.Products.Add(product);
        await _db.SaveChangesAsync();
        return RedirectToAction(nameof(Index));
    }

    return View(product);
}

Relevant part of the view:

<h2 class="text-info">Add New Product</h2>
<form asp-action="Create" method="post" enctype="multipart/form-data">
    <div class="p-4 rounded border">
        <div asp-validation-summary="ModelOnly" class="text-danger">
        </div>
        // ... Other field
        <div class="form-group row mb-3">
            <div class="col-2">
                <label asp-for="Image"></label>
            </div>
            <div class="col-5">
                <input asp-for="Image" class="form-control" type="file" />
            </div>
            <span asp-validation-for="Image" class="text-danger"></span>
        </div>
        // ... Other field
        <div class="form-group">
            <input type="submit" class="btn btn-primary" value="Save" />
            <a asp-action="Index" class="btn btn-success">Back to List</a>
        </div>
    </div>
</form>

@section Scripts {
    @{
        await Html.RenderPartialAsync("_ValidationScriptsPartial.cshtml");
    }
}

Products model class:

public class Products
{
    public int Id { get; set; }
    [Required]
    public string Name { get; set; }
    [Required]
    public decimal Price { get; set; }
    public string Image { get; set; }
    [Display(Name = "Product Color")]
    public string ProductColor { get; set; }

    [Required]
    [Display(Name = "Available")]
    public bool IsAvailable { get; set; }

    [Display(Name = "Product Type")]
    [Required]
    public int ProductTypeId { get; set; }

    [ForeignKey("ProductTypeId")]
    public ProductTypes ProductTypes { get; set; }

    [Display(Name = "Special Tag")]
    [Required]
    public int SpecialTagId { get; set; }

    [ForeignKey("SpecialTagId")]
    public SpecialTag SpecialTag { get; set; }
}

When I fill out the form and select an image file, upon submission, the form doesn’t add the product to the database. Instead, it displays the error “The Image field is required” below the file input field.

I confirmed:

• The file is being selected in the input field before submission.
• Other required fields are being filled correctly.
• The controller action is being hit when the form is submitted.

I’m not sure why the image upload is failing or why the validation error is occurring despite a file being selected. Any help in identifying the cause of this issue or suggestions for resolving it would be greatly appreciated.