【问题标题】:Jquery Validate not validating dropdownlistsJquery Validate 不验证下拉列表
【发布时间】:2022-06-11 02:20:04
【问题描述】:

我的 .net 5 core mvc 视图中有四个下拉列表。一个是从包含在运行时传递给视图的模型中的列表中填充的,另外三个是通过 Json 调用填充的。我的表单需要所有这四个 DDL,但 Jquery Validate 只捕获其中两个,我不知道为什么。

四个DDL的基本代码如下。首先,验证失败的两个:

@* This DDL is populated from a list in the model *@    

<select id="mGroup" required>
    <option selected="selected" value="">Select Material Group</option>
        @foreach (var item in Model.groups)
        {
            <option value="@item.group" style="background-color: @item.hex_color;">
                @item.name
            </option>
        }
</select>

@* This DDL is populated from a Json call, triggered when a value is selected in the first DDL *@

<select id="mSubGroup" tabindex="7" required>
    <option value="">Select Material Group</option>
</select>

当我尝试提交我的表单而不选择这些 DDL 中的有效选项时,验证触发器并且它们被分配了“输入验证错误”类,这正是我想要的。

但是,下面的两个 DDL 都由 Json 调用填充,没有看到这种情况发生。

<select id="class" required>
    <option value="" selected="selected">Select Class</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
</select>

<select id="limit" required>
    <option value="" selected="selected">Select Limit</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
</select>

当我尝试提交表单而不选择这些 DDL 上的选项时,没有任何反应。它们的 HTML 保持不变。即使我尝试在我提到的前两个 DDL 中选择有效选项,这些仍然没有得到验证。

包含这些 DDL(以及我的所有其他输入)的表单在代码中设置如下:

@using (Html.BeginForm(FormMethod.Post, new {id = "qForm"}))

...因为表单包含多个“提交”按钮,每个按钮都会触发不同的表单操作。在这些按钮的点击事件的 javascript 中,我调用了

$('#rfqForm').validate();

根据 Jquery Validate 文档。

我的表单也受模型中的 MVC 服务器端验证。这四个下拉菜单中的每一个都将它们选择的值输入到连接到回发模型的“Html.HiddenFor”对象中,我知道这不包括在 DOM 验证中。但是,当我将这些隐藏字段替换为某些内容时,例如用 CSS 隐藏的文本框,验证仍然不会触发。这就是我尝试走 Jquery 路线的原因。

我需要验证这些下拉菜单。我希望有人能解释这里出了什么问题。

【问题讨论】:

  • 您需要手动更新rules 以包含动态创建的元素,验证本身不会神奇地执行此操作。例如stackoverflow.com/a/49334425/519413
  • the other three are populated through Json calls 这就是为什么asp.net核心验证不适用于3下拉菜单,所以实际上你必须通过自己的代码进行验证(jquery很好)并且不要使用默认表单提交,但使用 ajax post...

标签: jquery validation asp.net-core-mvc .net-5


【解决方案1】:

事实证明,将这些下拉列表中的选定值复制到用 CSS 隐藏的 TextBox 中,而不是隐藏字段,然后从这些下拉列表中运行我的验证是可行的方法。问题是我需要用“可见性:隐藏”而不是“显示:无”来隐藏它们,我之前尝试过。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-03-12
    • 1970-01-01
    • 2016-07-17
    相关资源
    最近更新 更多