首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >尝试更改规则时,验证所需的jquery不起作用

尝试更改规则时,验证所需的jquery不起作用
EN

Stack Overflow用户
提问于 2018-09-14 01:59:22
回答 1查看 31关注 0票数 1

我有两个字段。我正试着在第一个数字中插入一个数字。第二个值应小于或等于第一个字段。

我使用jquery验证来警告用户,但是当我这样做时,它不会改变消息和布局。

我试着按照文档操作,但不明白哪里出了问题。

代码语言:javascript
复制
<div class="form-group">
     <label class="control-label" for="inputDefault-4">Quantidade permitida por pedido<span class="text-danger">*</span></label>
            @Html.TextBoxFor(t => t.Produto.QuantidadeVenda, new { maxlength = "10", @class = "form-control", @id = "quantidade_pedido", placeholder = "0", validate = "required",@name = "quantidade_pedido" , @type = "number" })
</div>

<div class="form-group">
      <label class="control-label" for="inputDefault-4">Possui regime de comodato<span class="text-danger">*</span></label>
      <div>
          @Html.CheckBoxFor(t => t.Produto.FlagComodato, new { @class = "chk-inativar switcher-example-default", @id = "comodato", @onclick = "checkComodato(this)" })
      </div>
</div>
<div id="limitEmprestimo" style="display: none" class="form-group">
      <label class="control-label" for="quantidade_comodato">Quantidade limite de empréstimo <span class="text-danger">*</span></label>
      @Html.TextBoxFor(t => t.Produto.QuantidadeComodato, new { maxlength = "10", @class = "form-control", @id = "quantidade_comodato", placeholder = "0", validate = "required", @name = "quantidade_comodato", @type = "number"})
function checkComodato(check) {
    if (check.checked) {
        $("#limitEmprestimo").show();
    }
    else {
        $("#limitEmprestimo").hide();
    }
}

 $("#quantidade_comodato").focusout(function () {
    var quantc = $("#quantidade_comodato").val() === "" ? 0 : parseInt($("#quantidade_comodato").val());

    var quantp = $("#quantidade_pedido").val() === "" ? 0 : parseInt($("#quantidade_pedido").val());

    if (quantc > quantp) {

        var validator = $("#frmCadastro").validate();
        $("#quantidade_comodato").rules("remove", "required");
        $("#quantidade_comodato").rules("add", {
            max: quantp,
            messages: {
                quantp: "Invalid !"
            }
        });
        validator.element($(this));
    }
});
EN

回答 1

Stack Overflow用户

发布于 2018-09-14 02:11:15

问题很可能是jquery脚本不在<script>标记内。因此,浏览器不会理解你的代码应该作为javascript运行,相反,浏览器只会认为你的代码是纯文本。

试试这个:

代码语言:javascript
复制
<div class="form-group">
    <label class="control-label" for="inputDefault-4">Quantidade permitida por pedido<span class="text-danger">*</span></label>
    @Html.TextBoxFor(t => t.Produto.QuantidadeVenda, new { maxlength = "10", @class = "form-control", @id = "quantidade_pedido", placeholder = "0", validate = "required",@name = "quantidade_pedido" , @type = "number" })
</div>
<div class="form-group">
    <label class="control-label" for="inputDefault-4">Possui regime de comodato<span class="text-danger">*</span></label>
    <div>
        @Html.CheckBoxFor(t => t.Produto.FlagComodato, new { @class = "chk-inativar switcher-example-default", @id = "comodato", @onclick = "checkComodato(this)" })
    </div>
</div>
<div id="limitEmprestimo" style="display: none" class="form-group">
    <label class="control-label" for="quantidade_comodato">Quantidade limite de empréstimo <span class="text-danger">*</span></label>
    @Html.TextBoxFor(t => t.Produto.QuantidadeComodato, new { maxlength = "10", @class = "form-control", @id = "quantidade_comodato", placeholder = "0", validate = "required", @name = "quantidade_comodato", @type = "number"})
</div>

<script>

    function checkComodato(check) {
        if (check.checked) {
            $("#limitEmprestimo").show();
        }
        else {
            $("#limitEmprestimo").hide();
        }
    }

    $("#quantidade_comodato").focusout(function () {
        var quantc = $("#quantidade_comodato").val() === "" ? 0 : parseInt($("#quantidade_comodato").val());

        var quantp = $("#quantidade_pedido").val() === "" ? 0 : parseInt($("#quantidade_pedido").val());

        if (quantc > quantp) {

            var validator = $("#frmCadastro").validate();
            $("#quantidade_comodato").rules("remove", "required");
            $("#quantidade_comodato").rules("add", {
                max: quantp,
                messages: {
                    quantp: "Invalid !"
                }
            });
            validator.element($(this));
        }
    });

</script>

如果这不是问题所在,另一个典型的问题是jquery脚本被加载到_layout.cshtml的末尾。所以当你调用jquery时,它还没有被定义。在这种情况下,您应该会在开发人员控制台中得到一个脚本错误(在浏览器中点击F12以显示它)。

通过将脚本包装在Razor部分中,可以很容易地纠正这个问题。

代码语言:javascript
复制
@section Scripts
{
    <script>
        // your code here
    </script>
}

“脚本”在_Layout.cshtml中声明为@RenderSection("Scripts", required: false)

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/52319360

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档