要在ASP.NET Core MVC的多步骤表单中在每个步骤触发客户端验证,可以按照以下步骤进行操作:
using Microsoft.AspNetCore.Mvc;
namespace YourProject.Controllers
{
public class StepFormController : Controller
{
public IActionResult Index()
{
// 第一步表单视图
return View("Step1");
}
[HttpPost]
public IActionResult Step1(Step1ViewModel model)
{
// 验证第一步表单
if (!ModelState.IsValid)
{
return View(model);
}
// 第二步表单视图
return View("Step2");
}
[HttpPost]
public IActionResult Step2(Step2ViewModel model)
{
// 验证第二步表单
if (!ModelState.IsValid)
{
return View(model);
}
// 第三步表单视图
return View("Step3");
}
[HttpPost]
public IActionResult Step3(Step3ViewModel model)
{
// 验证第三步表单
if (!ModelState.IsValid)
{
return View(model);
}
// 保存表单数据或执行其他操作
// ...
// 完成后重定向到成功页面
return RedirectToAction("Success");
}
public IActionResult Success()
{
return View();
}
}
}
创建相应的视图文件(Step1.cshtml、Step2.cshtml、Step3.cshtml和Success.cshtml)并添加基本的表单HTML代码和验证规则。
在_Layout.cshtml文件中添加以下代码,以确保客户端验证脚本在每个步骤中都得到加载:
@await Html.PartialAsync("_ValidationScriptsPartial")
这样,当用户在每个步骤中提交表单时,客户端验证将被触发,并根据验证规则检查表单字段。如果验证失败,用户将留在当前步骤的表单视图中,并显示相应的错误消息。如果验证成功,用户将继续下一个步骤,直到最后一个步骤完成并重定向到成功页面。