Fatal编程技术网
  • csharp/
  • C# 如果没有从dropDownList中选择任何内容，是否有方法手动触发所需的验证

C# 如果没有从dropDownList中选择任何内容，是否有方法手动触发所需的验证

c# jquery asp.net-core razor

C# 如果没有从dropDownList中选择任何内容，是否有方法手动触发所需的验证,c#,jquery,asp.net-core,razor,mdbootstrap,C#,Jquery,Asp.net Core,Razor,Mdbootstrap,我有一个razor页面应用程序，它在一个cshtml页面中创建一个dropDownList 看法 @Html.DropDownListFor（model=>model.SelectedItem，model.Items，新建 { @class=“**下拉列表**”， }) @Html.ValidationMessageFor（model=>model.SelectedItem） 模型 public IEnumerable Items{get；set；} [必需（ErrorMessage=“所选项

我有一个razor页面应用程序，它在一个cshtml页面中创建一个dropDownList

看法

@Html.DropDownListFor（model=>model.SelectedItem，model.Items，新建
{
@class=“**下拉列表**”，
})
@Html.ValidationMessageFor（model=>model.SelectedItem）
模型

public IEnumerable Items{get；set；}
[必需（ErrorMessage=“所选项目字段是必需的。”）]
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>

<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="">
验证错误消息显示当表单提交时下拉列表未选择任何内容，这是预期的行为

然而，最近我添加了一个名为Material Design Bootstrap的新JavaScript来改变组件的一些外观

看法

@Html.DropDownListFor（model=>model.SelectedItem，model.Items，新建
{
@class=“**选择**”，
})
@Html.ValidationMessageFor（model=>model.SelectedItem）
被填充的元素

<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>

<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。因此，当没有为dropdownList选择任何值时，验证错误消息不会显示，表单将成功提交。我已经手动添加了数据val=“true”和数据val required=“所选项目字段是必需的。”但这也没有帮助

我可以看到，当我添加'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的方法？

这是我的整个工作演示，您可以查看：

_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>


@ViewData[“标题”]
@RenderBody（）
@RenderSection（“脚本”，必需：false）
_ValidationScript.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");}

}

@model DropDownDTO
@DropDownListFor（model=>model.SelectedItem，model.Items，新建
{
@class=“**选择**”，
})
@Html.ValidationMessageFor（model=>model.SelectedItem）
@节脚本
{
@{wait Html.RenderPartialAsync（“_validationScript”）；}
}
家庭控制器：

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();
}

公共异步任务索引（）
{
var模型=新的DropDownDTO（）
{
Items=新列表（）{
新建SelectListItem（）{Value=”“，Text=”“}，//确保为第一个选项添加空值。。。
新建SelectListItem（）{Value=“1”，Text=“Elementos1”}，
新建SelectListItem（）{Value=“2”，Text=“Elementos2”}，
新建SelectListItem（）{Value=“3”，Text=“Elementos3”}
}
};
返回视图（模型）；
}
[HttpPost]
公共IActionResult索引（下拉到模型）
{
返回视图（）；
}
您确定MDB支持下拉列表验证吗？它在我的项目中运行良好。你能分享更多的代码吗？另外，您的nuget包引用是什么？ 
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();
}