在 Asp.net Core 中使用 Ajax 的验证表单
Posted
技术标签:
【中文标题】在 Asp.net Core 中使用 Ajax 的验证表单【英文标题】:Validation Form With Ajax in Asp.net Core 【发布时间】:2018-07-02 08:29:01 【问题描述】:我使用 AJAX 将表单发送到 ASP.NET Core 中的控制器,但我在发送带有验证的表单时遇到问题
<form asp-action="Create" asp-controller="Departments"
data-ajax="true"
data-ajax-method="Post"
data-ajax-mode="replace"
data-ajax-update="#content"
data-ajax-success="Success"
data-ajax-failure="Failure">
<div class="box-body">
<div class="alert alert-success" id="divalert" ></div>
<div class="form-group">
<label asp-for="Title" class="control-label"></label>
<input asp-for="Title" class="form-control" />
<span asp-validation-for="Title" class="text-danger"></span>
</div>
<div class="form-group">
<input type="submit" value="ثبت" class="btn btn-success" />
</div>
</div>
</form>
这是 Ajax 的 Jquery 代码
<script>
function Success()
$("#divalert").text = "Yes";
function Failure()
$("#divalert").text = "No";
</script>
但我想在发送带有空文本框的表单时显示验证消息,
这是我的控制器
public async Task<IActionResult> Create([Bind("Department_Id,Title,Task,Description,Department_Status")] Department department)
if (ModelState.IsValid)
_genericRepository.Add(department);
await _genericRepository.SaveChangesAsync();
return RedirectToAction(nameof(Index));
return View(department);
当表单为空时如何使用 Ajax 显示验证消息?
【问题讨论】:
@mplungjan,OP 正在使用jquery.unobtrusive-ajax.js
插件(它进行 ajax 调用)
您显示的代码可以正常工作,并且不会提交假设您在Title
属性上具有[Required]
属性。您是否正确加载了所有相关脚本?
@StephenMuecke 我在哪里可以看到?
@mahdi:请不要将问题中的每个单词都大写。阅读真的很烦人
这与客户端验证无关!
【参考方案1】:
我使用局部视图“创建”并且它有效
<script src="~/lib/jquery/dist/jquery.js"></script>
<script src="~/lib/jquery-validation/dist/jquery.validate.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js"></script>
<div class="form-horizontal">
<form asp-action="Create" role="form" asp-controller="Department" asp-antiforgery="true"
data-ajax-success="Bindgrid"
data-ajax="true"
data-ajax-method="POST">
<div class="form-group">
<label class="control-label" asp-for="DepartmentName"></label>
<input class="form-control" type="text" asp-for="DepartmentName" />
<span asp-validation-for="DepartmentName" class="text-danger"></span>
</div>
<input class="btn btn-primary" type="submit" value="Save" />
</form>
</div>
html 或 ajax 验证需要所有 jquery 文件。
【讨论】:
【参考方案2】:我用这种方法,效果很好
我应该这样编码吗?
我将控制器从 IActionResult 更改为 JsonResult 。
public async Task<JsonResult>
Create([Bind("Department_Id,Title,Task,Description,Department_Status")]
Department department)
if (ModelState.IsValid)
_genericRepository.Add(department);
await _genericRepository.SaveChangesAsync();
return Json(department);
return Json(department);
`
【讨论】:
以上是关于在 Asp.net Core 中使用 Ajax 的验证表单的主要内容,如果未能解决你的问题,请参考以下文章
在 ASP.NET Core 中使用 ajax 向控制器发送数据
在 ASP.NET CORE 表单中使用 AJAX 返回 JSON
如何在带有 ADO.NET 的 ASP.NET Core MVC 中使用 jQuery Ajax 自动完成