0

フォームを検証しています。すべてのフィールドを正しく検証しますが、テキストフィールドに正しいデータを入力しても、データを処理して返されませんが、返しeverything wrongてほしいのですがeverything correct

これが私のjsコードです

var url, container, form,
    View = {
        init: function () {
            container     = $('.container');
            $(document).on('submit', '#form', View.findView);
        },

        loadViews: function (view, flag, e) {
            e.preventDefault();
            var search = $('.search');

            if( flag ) {
                if ( View.validation.emptyFieldsValidation() == true ) {
                    console.log('everything correct');
                } else {
                    console.log('everything incorrect');
                }
            }
            return false;
        },

        validation: {
            emptyFieldsValidation: function () {
                var inputs, field;

                $('#form input').each(function (i, el) {
                    inputs = $(this);
                    if ( inputs.val() == '' ) {
                        inputs.css('border', '1px solid red');
                        return false;
                    } else {
                        inputs.css('border', '1px solid #ccc');
                        if (inputs.hasClass('from')) {
                            console.log('from');
                            if (View.validation.validateAddress(inputs.val())) {
                                console.log('from correct address');
                                return true;
                            }
                            else {
                                inputs.css('border', '1px solid red');
                                console.log('from incorrect address');
                                //return false;
                            }
                        }
                        if (inputs.hasClass('to')) {
                            console.log('to');
                            if (View.validation.validateAddress(inputs.val())) {
                                console.log('to correct address');
                                //return true;
                            }
                            else {
                                inputs.css('border', '1px solid red');
                                console.log('to incorrect address');
                                //return false;
                            }
                        }
                        if (inputs.hasClass('time')) {
                            if (View.validation.validateForNumber(inputs.val())) {
                                console.log('time correct');
                                //return true;
                            }
                            else {
                                inputs.css('border', '1px solid red');
                                console.log('time incorrect');
                                //return false;
                            }
                        }
                    }
                });
                return false;
            },

            validateAddress: function (val) {
                var streetregex = /^[\w+\s]+\d+,\s*[\s\w]+$/;
                if (streetregex.test(val)) return true;
                else return false;
            },

            validateForNumber: function (val) {
                if (!isNaN(val)) return true;
                else return false;
            }
        }
    };

View.init();

これが私のHTMLコードです

<section class="search">
<form id="form" action="">
    <section>
        <input type="text" name="from" class="from address" id="addressone" placeholder="From">
    </section>
    <section>
        <input type="text" name="to" class="to address" id="addresstwo" placeholder="To">
    </section>
    <section>
        <label>Time</label>
        <input type="text" name="hrs" placeholder="Hours" class="t1 time">
        <span>:</span>
        <input type="text" name="mins" placeholder="Mins" class="t1 time">
        <button class="button">Search</button>
    </section>
</form>
</section>

アップデート

この出力をコンソールに表示しています

スクリーンショット

4

1 に答える 1

1

本体の他のすべてのステートメントは実際には「反復子」関数の一部であるため、emptyFieldsValidation関数が常にになるという事実を見逃しているようです。後者について言えば、 in callback は反復を停止することに注意してください。return falsereturnreturn false$.each

return false考えられる解決策の 1 つは、イテレータ関数内のこれらすべてのステートメントを、代わりに検証エラーの配列を埋めるものに置き換えることです。次に（$.each行の後）、その長さを確認できます（または単に実行しますreturn !!errors.length）。例えば：

emptyFieldsValidation: function () {
  var errors = [];
  ...
  $('#form input').each(function() {
    if (! someValidationCheck) { 
      errors.push(someValidationAttribute);  
    }
  });
  ...
  return !!errors.length;
于 2012-11-05T12:07:08.457 に答える