在ASP.NET MVC中使用JQuery上传表单数据及文件的实现咨询

没问题，我来帮你搞定ASP.NET MVC中同时提交客户信息和文件上传的需求。结合你给出的代码片段，我会从ViewModel定义、前端表单完善到后端控制器处理，给你一套完整的解决方案：

首先你需要创建一个ViewModel，用来同时承载客户信息字段和上传的文件：

public class PersonViewModel
{
    [Required(ErrorMessage = "First Name is required")]
    public string FName { get; set; }

    // 按需添加其他客户信息字段，比如姓氏、邮箱、电话等
    public string LName { get; set; }
    public string Email { get; set; }

    // 用于接收上传的文件，ASP.NET MVC标准类型是HttpPostedFileBase
    public HttpPostedFileBase ProfilePhoto { get; set; }
}

你的现有代码已经设置了关键的enctype="multipart/form-data"（这个是文件上传的核心，不能丢），我帮你补全剩余的表单字段和文件上传控件：

@model PersonViewModel

@{
    ViewBag.Title = "Add Person Info";
}

@using (Html.BeginForm("AddPersonInfo", "Management", FormMethod.Post, new { enctype = "multipart/form-data", id = "frmAddPerson" }))
{
    @Html.AntiForgeryToken()
    
    <div id="divControls" class="form-inline">
        <!-- 名字输入框 -->
        <div class="form-group mb-3">
            @Html.LabelFor(model => model.FName, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.FName, new { htmlAttributes = new { @class = "form-control", placeholder = "Enter first name" } })
                @Html.ValidationMessageFor(model => model.FName, "", new { @class = "text-danger" })
            </div>
        </div>

        <!-- 姓氏输入框 -->
        <div class="form-group mb-3">
            @Html.LabelFor(model => model.LName, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.LName, new { htmlAttributes = new { @class = "form-control", placeholder = "Enter last name" } })
                @Html.ValidationMessageFor(model => model.LName, "", new { @class = "text-danger" })
            </div>
        </div>

        <!-- 文件上传控件 -->
        <div class="form-group mb-3">
            <label class="control-label col-md-2">Profile Photo</label>
            <div class="col-md-10">
                <input type="file" name="ProfilePhoto" class="form-control-file" accept="image/*" />
                <!-- accept属性可选，限制上传文件类型为图片 -->
            </div>
        </div>

        <!-- 提交按钮 -->
        <div class="form-group mb-3">
            <div class="col-md-offset-2 col-md-10">
                <button type="submit" class="btn btn-primary">Save Info</button>
            </div>
        </div>
    </div>
}

在ManagementController中实现AddPersonInfo方法，同时处理客户信息的保存和文件上传：

using System.IO;
using System.Web;
using System.Web.Mvc;

public class ManagementController : Controller
{
    // 假设你有EF的DbContext实例
    private YourDbContext db = new YourDbContext();

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult AddPersonInfo(PersonViewModel model)
    {
        if (ModelState.IsValid)
        {
            // 1. 保存客户信息到数据库
            var newPerson = new Person
            {
                FirstName = model.FName,
                LastName = model.LName,
                Email = model.Email
                // 其他字段赋值
            };
            db.People.Add(newPerson);
            db.SaveChanges();

            // 2. 处理文件上传（如果有文件的话）
            if (model.ProfilePhoto != null && model.ProfilePhoto.ContentLength > 0)
            {
                // 定义文件保存路径，建议用App_Data下的Uploads文件夹（安全且不易被直接访问）
                string uploadDir = Server.MapPath("~/App_Data/Uploads");
                // 确保文件夹存在，避免报错
                if (!Directory.Exists(uploadDir))
                {
                    Directory.CreateDirectory(uploadDir);
                }

                // 生成唯一文件名，防止同名文件覆盖
                string uniqueFileName = Guid.NewGuid().ToString() + Path.GetExtension(model.ProfilePhoto.FileName);
                string filePath = Path.Combine(uploadDir, uniqueFileName);

                // 保存文件到服务器
                model.ProfilePhoto.SaveAs(filePath);

                // 可选：把文件路径保存到数据库关联的Person记录中
                newPerson.PhotoFilePath = $"/App_Data/Uploads/{uniqueFileName}";
                db.SaveChanges();
            }

            // 跳转到成功页面或列表页
            return RedirectToAction("PersonList");
        }

        // 如果模型验证失败，返回表单页显示错误
        return View(model);
    }
}

• 必须保留enctype="multipart/form-data"：没有这个属性，表单无法传递文件数据，这个你已经设置对了，很好！
• 文件大小限制：默认ASP.NET有上传文件大小限制（通常4MB），如果需要支持更大的文件，要修改web.config中的maxRequestLength和maxAllowedContentLength配置。
• 文件类型验证：前端的accept只是客户端限制，后端一定要再验证文件的MIME类型和扩展名，防止恶意文件上传。
• 文件存储位置：尽量不要把上传文件放在网站根目录下的公开文件夹（比如~/Content），避免被直接访问或被爬虫抓取，用App_Data文件夹更安全。

内容的提问来源于stack exchange，提问作者Eisa Karimi