bootstrap-validate JQ自定义验证（防老年痴呆）

最新推荐文章于 2022-12-07 15:57:11 发布

Ai卿

最新推荐文章于 2022-12-07 15:57:11 发布

阅读量347

点赞数

分类专栏： # Bootstrap

本文链接：https://blog.csdn.net/qq_42307369/article/details/100984930

版权

本文介绍了如何利用bootstrap-validate结合JQ实现前端表单验证，详细讲解了各种常见验证规则，如中文、字母、数字、下划线的正则匹配，以及输入长度限制、特殊字符检查等，旨在提升用户体验，防止无效提交。

摘要由CSDN通过智能技术生成

ajax验证做成函数，可用于下拉框验证好展示提示信息

function checkUser() {
    var deferred = $.Deferred();//创建一个延迟对象
    $.ajax({
        url: ctx + "order/orderProgramme/currencyUniqueness?orderTerminalId=" + $("#orderTerminalId").val() + "&orderMainbranchId=" + $("#orderMainbranchId").val(),
        async: false,//要指定不能异步,必须等待后台服务校验完成再执行后续代码
        dataType: "json",
        success: function (data) {
            if (data) {
                deferred.resolve();
            } else {
                deferred.reject();
            }
        }
    });
    //deferred.state()有3个状态:pending:还未结束,rejected:失败,resolved:成功
    return deferred.state() == "resolved" ? true : false;
}

提交前验证

function submitHandler() {
    if(!checkUser()){
        $.modal.alertError("该通用方案已存在，请重新设置！")
    }else if ($.common.isEmpty($("#orderTerminalId").val())) {
        $.modal.alertError("货运站不能为空！")
    }else if ($.validate.form()) {
        $.operate.save(prefix + "/edit", $('#form-orderProgramme-edit').serialize());
    }
}