使用引导和jQuery验证表单

使用引导和jQuery验证表单,jquery,html,validation,twitter-bootstrap-3,Jquery,Html,Validation,Twitter Bootstrap 3,我正在尝试使用jQuery验证表单,但无法使其正常工作。 我已经看到了几个例子,但我没有正常工作 我已经发布了几个警报,当我点击搜索按钮时,它会工作,但不会进入错误功能来验证所需字段,因为不会显示警报 HTML 客户编号(F) 姓 出生日期 邮政编码 JS submitForm:function($scope){ 警报(“提交确定”); //努梅罗斯许可证持有人 $(“#客户编号F、#卡号、#账号、#客户编号J”)。按键(功能(键){ 如果(key.charCode57)返回false; }

我正在尝试使用jQuery验证表单,但无法使其正常工作。 我已经看到了几个例子,但我没有正常工作

我已经发布了几个警报,当我点击搜索按钮时,它会工作,但不会进入错误功能来验证所需字段,因为不会显示警报

HTML


客户编号(F)
姓
出生日期
邮政编码
JS

submitForm:function($scope){
警报(“提交确定”);
//努梅罗斯许可证持有人
$(“#客户编号F、#卡号、#账号、#客户编号J”)。按键(功能(键){
如果(key.charCode<48 | | key.charCode>57)返回false;
});
$(“#搜索”)。在(“单击”,函数()上){
警报(“搜索确定”);
/*http://rickharrison.github.io/validate.js/*/  
新的FormValidator('myform'[{
名称:'客户编号',
显示:“客户编号”,
规则:“数字”
}, {
姓名:'姓',
显示:“姓氏”,
规则:“字母数字”
}, {
姓名:'出生日期',
显示:“出生日期”,
规则:“必需|最大长度[10]”
}, {            
姓名:'邮政编码',
显示:“邮政编码”,
规则:“数字|最大长度[8]”
}],函数(错误,evt){
警报(“错误不起作用”);
变量选择器错误=$(“.error\u框”),
选择器_SUCCESS=$(“.SUCCESS_框”);
如果(errors.length>0){
选择器_错误。空();
对于(变量i=0,errorLength=errors.length;i');
}
选择器_SUCCESS.css({display:'none'});
选择器_错误。fadeIn(200);
}否则{
选择器_ERRORS.css({display:'none'});
fadeIn(200);
//好的,从validado,muestro tabla
}
如果(evt&&evt.preventDefault){
evt.preventDefault();
}else if(事件){
event.returnValue=false;
}
});
});         
$(“#清除”)。在(“单击”,函数(){
CustomerSearch.resetForm($scope);
});             
}
我更改了这个代码
$(“#搜索”)。在(“单击”上,函数(){
用于另一个
$(“#搜索”)。单击(函数(){
),它也不起作用


现在我开始使用一些AngularJS,为此,我在JQuery“$scope”中加入了它,如果这是我不满意的地方,我就把它去掉,但我仍然不工作

这里有一个严重的语法错误:
alert('error DON'T work'))
…请注意两个单引号中是如何包含一个单引号的。OP中代码的视觉格式会立即显示这一点。此外,当您的问题与此插件无关时,请不要使用标记。若要解决警报问题,请使用
\
这样的
\
警报(
错误不起作用]);
我现在用英语写了这个警报,但在我的代码中是类似西班牙语的警报(“entra en function error”);这就是我的警报,很抱歉我在代码中犯了错误,只是我写这个是因为我想说函数错误不起作用这里有些东西可能对你有用
<div id="partial-customertype-personal">
    <div class="form-group col-xs-3 col-md-3">
        <label for="customernumberF" class="control-label">Customer Number (F)</label>
        <input type="text" class="form-control" id="customer-numberF" name="customer-numberF" maxlength="9" />
</div>
<div class="form-group col-xs-5 col-md-5">
    <label for="surname" class="control-label">Surname</label>
    <input type="text" class="form-control" id="surname" name="surname" maxlength="50" />
</div>
<div class="form-group col-xs-2 col-md-2">
    <label for="datebirth" class="control-label">Date of Birth</label>
    <div class="input-group date" id="datetimepicker1">
        <input type="text" class="form-control" id="date-birth" name="date-birth" maxlength="10" />
        <span class="input-group-addon">
            <span class="glyphicon glyphicon-calendar"></span>
        </span>
    </div>                      
</div>
<div class="form-group col-xs-2 col-md-2">
    <label for="postcode" class="control-label">Post Code</label>
    <input type="text" class="form-control" size="4" id="post-code" name="post-code" maxlength="8" />
</div>
submitForm : function($scope){
        alert('submit OK');
        // solo permites números
        $("#customer-numberF, #card-number, #account-number, #customer-numberJ").keypress(function(key) {
            if(key.charCode < 48 || key.charCode > 57) return false;
        });

        $("#search").on( "click", function() {
            alert('search OK');
            /*http://rickharrison.github.io/validate.js/*/  
            new FormValidator('myform', [{
                name: 'customer-number',
                display: 'Customer Number',
                rules: 'numeric'
            }, {
                name: 'surname',
                display: 'Surname',
                rules: 'alpha_numeric'
            }, {
                name: 'date-birth',
                display: 'Date of Birth',
                rules: 'required|max_length[10]'
            }, {            
                name: 'post-code',
                display: 'Post Code',
                rules: 'numeric|max_length[8]'          
            }], function(errors, evt) {
                alert('error DON'T WORK');

                var SELECTOR_ERRORS = $(".error_box"),
                    SELECTOR_SUCCESS = $(".success_box");

                if (errors.length > 0) {
                    SELECTOR_ERRORS.empty();

                    for (var i = 0, errorLength = errors.length; i < errorLength; i++) {
                        SELECTOR_ERRORS.append(errors[i].message + '<br />');
                    }

                    SELECTOR_SUCCESS.css({ display: 'none' });
                    SELECTOR_ERRORS.fadeIn(200);
                } else {
                    SELECTOR_ERRORS.css({ display: 'none' });
                    SELECTOR_SUCCESS.fadeIn(200);
                    //ok form validado, muestro tabla
                }

                if (evt && evt.preventDefault) {
                    evt.preventDefault();
                } else if (event) {
                    event.returnValue = false;
                }
            });
        });         

        $("#clear").on( "click", function() {
            CustomerSearch.resetForm($scope);
        });             
    }