使用Bootstrap和jQuery验证表单

时间:2016-01-19 17:02:24

标签: jquery html5 validation twitter-bootstrap-3

我尝试使用jQuery验证表单但无法使其工作。 我看过几个例子,但是我的工作不正常。

我已经发出了几个警报,当我点击搜索按钮时,它可以正常工作,但是没有输入错误功能来验证必填字段,因为没有显示警报

HTML

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);
        });             
    }

JS

$("#search").on( "click", function() {

我为其他$("#search").click( function() {更改了此代码import random l = [random.randrange(1, 100) for i in xrange(10000000)] antStart = 30 def listcomp(): rowCount = len([i for i in l if i < antStart]) def usingLoop(): rowCount = 0 for i in l: if i < antStart: rowCount = rowCount+1 import timeit print "list comp : ",timeit.timeit(listcomp, number=100) print "loop : ",timeit.timeit(usingLoop, number=100) ,但它也不起作用。

现在我开始使用一些AngularJS,为此我放入了JQuery&#34; $ scope&#34;,如果它失败了我就把它取下来,但我仍然无法工作< / p>

0 个答案:

没有答案