鉴于没有从 dropDownList 中选择任何内容，有没有办法手动触发所需的验证
Posted
技术标签:
【中文标题】鉴于没有从 dropDownList 中选择任何内容，有没有办法手动触发所需的验证【英文标题】：Is there a way to trigger required validation manually given that nothing is selected from the dropDownList 【发布时间】：2021-08-18 00:27:57 【问题描述】：我有一个 razor 页面应用程序，它在其中一个 cshtml 页面中创建一个 dropDownList。
查看
@Html.DropDownListFor(model => model.SelectedItem, model.Items, new
@class = "**dropDown**",
)
<div class="error">
@Html.ValidationMessageFor(model => model.SelectedItem)
</div>
型号
public IEnumerable<SelectListItem> Items get; set;
[Required(ErrorMessage = "Selected Item field is required.")]
public int SelectedItem get; set;
被填充的元素
<select class="dropDown" data-val="true" data-val-number="The field Items must be a number." data-val-required="Selected Item field is required." id="SelectedItem" name="SelectedItem"></select>
验证错误消息显示，当表单提交时下拉菜单未选择任何内容，这是预期的行为。
不过，最近我添加了一个名为 Material Design Bootstrap 的新 javascript 来改变组件的一些外观。
查看
@Html.DropDownListFor(model => model.SelectedItem, model.Items, new
@class = "**select**",
)
<div class="error">
@Html.ValidationMessageFor(model => model.SelectedItem)
</div>
被填充的元素
<input class="form-control select-input placeholder-active" type="text" role="listbox" aria-multiselectable="false" aria-disabled="false" aria-haspopup="true" aria-expanded="false" readonly="">
您可以立即看到 MBD 将其自定义行为更改元素从 select 应用到 input。因此，当没有为下拉列表选择任何值时，不会显示验证错误消息，并且表单会成功提交。我手动添加了 data-val="true" 和 data-val-required="Selected Item field is required。" 但这也没有帮助。 p>
我可以看到，当我添加 'required' 属性并提交表单时，元素会更新为
<input class="form-control select-input placeholder-active input-validation-error" type="text" role="listbox" aria-multiselectable="false" aria-disabled="false" aria-haspopup="true" aria-expanded="false" readonly="" required="" data-val="true" data-val-required="Selected Item field is requiredis required." aria-required="true" aria-describedby="-error -error -error -error -error" aria-invalid="true">
但仍然没有验证消息的迹象。
是否有手动触发 ValidationMessageFor 的方法？
【问题讨论】：
你确定MDB支持下拉验证吗？ 它在我的项目中运行良好。你能分享更多的代码吗？另外，你的 nuget 包引用是什么？ 【参考方案1】：这是我的整个工作演示，您可以查看：
_Layout.cshtml：
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"]</title>
<!-- Font Awesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css">
<!-- Google Fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap">
<!-- Bootstrap core CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet">
<!-- Material Design Bootstrap -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.19.1/css/mdb.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<main role="main" class="pb-3">
@RenderBody()
</main>
</div>
<script src="~/js/site.js" asp-append-version="true"></script>
<!-- JQuery -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- Bootstrap tooltips -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.4/umd/popper.min.js"></script>
<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.min.js"></script>
<!-- MDB core JavaScript -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.19.1/js/mdb.min.js"></script>
@RenderSection("Scripts", required: false)
</body>
</html>
_ValidationScriptsPartial.cshtml：
<script src="~/lib/jquery-validation/dist/jquery.validate.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
Index.cshtml：
@model DropDownDTO
<form method="post">
@Html.DropDownListFor(model => model.SelectedItem, Model.Items, new
@class = "**select**",
)
<div class="error">
@Html.ValidationMessageFor(model => model.SelectedItem)
</div>
<input type="submit"value="Create" />
</form>
@section Scripts
@await Html.RenderPartialAsync("_ValidationScriptsPartial");
家庭控制器：
public async Task<ActionResult> Index()
var model = new DropDownDTO()
Items = new List<SelectListItem>()
new SelectListItem() Value = "", Text = "" , //be sure add null value for the first option...
new SelectListItem() Value = "1", Text = "Elementos1" ,
new SelectListItem() Value = "2", Text = "Elementos2" ,
new SelectListItem() Value = "3", Text = "Elementos3"
;
return View(model);
[HttpPost]
public IActionResult Index(DropDownDTO model)
return View();
【讨论】：
以上是关于鉴于没有从 dropDownList 中选择任何内容，有没有办法手动触发所需的验证的主要内容，如果未能解决你的问题，请参考以下文章
从 CloudFormation 模板中的 DropDownList 中选择多个值
Python：鉴于原始电子邮件没有“正文”标签或任何东西，如何从原始电子邮件中解析正文
DropDownList 的 SelectedIndexChanged 事件未触发
在@Html.DropDownList 中从控制器端绑定下拉列表选择的值