.net - 无法在 .NET Core 中验证表单
问题描述
<form id="formElem">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<input asp-for="ID" type="hidden" />
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<label asp-for="Name" class="control-label"></label>
<input asp-for="Name" required class="form-control" />
<span asp-validation-for="Name" class="text-danger"></span>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label asp-for="Description" class="control-label"></label>
<textarea asp-for="Description" required rows="5" class="form-control"></textarea>
<span asp-validation-for="Description" class="text-danger"></span>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label asp-for="ImageData" class="control-label"></label>
<input asp-for="ImageData" type="file" class="form-control" />
<span asp-validation-for="ImageData" class="text-danger"></span>
</div>
</div>
</div>
<div class="form-group col-sm-3">
<input type="submit" id="dataSend" name="btn" value="Save" class="btn btn-primary" />
</div>
</form>
JS:
$("#dataSend").on('click', function (e) {
e.preventDefault();
var formData = new FormData();
formData.append('ImageData', $('#ImageData')[0].files[0]);
formData.append('ID', document.getElementById('ID').value);
formData.append('Name', document.getElementById('Name').value);
formData.append('Description', document.getElementById('Description').value);
formData.append('btn', 'Save');
$.ajax({
contentType: false,
processData: false,
type: 'POST',
url: '/Products/AddProduct',
data: formData,
success: function (response) {
window.location.href = "/Products/Index";
},
error: function () {
console.log("error.");
},
});
});
当我单击保存按钮时,它直接调用AddProduct
操作,尽管所有表单字段都是空白的。我的问题是,为什么我的模型没有经过验证,尽管模型类中的和字段[Required]
上有注释。当我使用 JavaScript 时会发生这种情况。Name
Description
另外,我使用jquery.validate.unobtrusive.min.js
和jquery.validate.min.js
文件。
解决方案
e.preventDefault();
也会阻止表单验证。要在不提交表单的情况下检查验证,请使用valid()
. 如果错误为$("#formElem").valid() is not a function.
,请检查是否jquery.validate.min.js
包括在内。
作为
$("#dataSend").on('click', function (e) {
e.preventDefault();
$("#formElem").valid();
...
在您的 AddProduct 方法中,您是否检查了模型状态?如
if (!ModelState.IsValid)
{
//Don't add product
// return page();
}
推荐阅读
- javascript - 使用元素ui时如何将计算值放入表格道具中
- javascript - 根据索引从数组中删除对象
- mysql - 删除与 MySQL 中前一行没有区别的行
- sql - 聚合可能不会出现在 WHERE 子句中,除非它位于 HAVING 子句中包含的子查询中
- mysql - 如何在同一个表中选择多行,其中其他行的主键位于单独的列中?
- google-chrome - 重置 Chrome 的“打开方式”设置
- java - Java将for循环转换为lambda表达式
- javascript - 只选择子 div,而不是“孙子”div
- python - 用文本自动填充 SVG 对象(Python / svgwrite)?
- ios - 无法仅将本地 html 文件加载到设备上的 WKWebView 中(适用于模拟器)