bootstrapValidator动态添加校验字段

最新推荐文章于 2022-04-25 16:43:41 发布

最新推荐文章于 2022-04-25 16:43:41 发布 · 1.4k 阅读

文章标签：

#bootstrapValidator 校验框架

bootstrapValidator 专栏收录该内容

1 篇文章

订阅专栏

本文介绍如何使用 jQuery 和 Bootstrap Validator 插件实现表单验证中复选框关联字段的动态增加与删除功能。当用户勾选特定复选框时，将自动为其表单添加必填项验证；取消勾选时，则移除相应的验证规则。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

$("input:checkbox").on("ifChecked", function(event){
        var cId = $(this).attr("name");
        addField("seqNum"+cId,"顺序必填");
        addField("discount"+cId,"折扣率必填");
    });
    $("input:checkbox").on("ifUnchecked", function(event){
        console.log($(this).attr("name"))
        var cId = $(this).attr("name");
        removeField("seqNum"+cId);
        removeField("discount"+cId);
    });

    function addField(field,notEmptyMsg){
        $(".editForm").bootstrapValidator("addField", field,{
            validators: {
                notEmpty: {
                    message: notEmptyMsg
                }
            }
        });
    }

    function removeField(field){
        $(".editForm").bootstrapValidator("addField", field,{});
        $(".editForm").bootstrapValidator("removeField", field)
    }