4

jQuery 検証プラグインを RequireJs で動作させることができました。data-prefix の属性を持つタグでラップされたフィールドを検証しないように、jquery 検証の既定のパラメーターを設定しようとしています (これは Page1.js ファイルで行われます)。ただし、送信ボタンをクリックすると、両方のフィールドを検証しようとします。

コードは次のとおりです（より複雑なデモにリンクされた元の質問）：

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <meta charset="utf-8" />
    <script src="http://ajax.cdnjs.com/ajax/libs/require.js/2.1.5/require.js"></script>
    <script>
        require.config({
            paths: {
                'jquery': 'http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.3',
                'jquery.validate': 'http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate',
                'jquery.validate.unobtrusive': 'http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive'
            },
            shim: {
                'jquery.validate': ['jquery'],
                'jquery.validate.unobtrusive': ['jquery', 'jquery.validate']
            }
        });

        require(['jquery', 'jquery.validate', 'jquery.validate.unobtrusive'], function($) {
            $.validator.setDefaults({
                ignore: '[data-js-val-prefix] *'
            });
        });
    </script>
</head>
<body>
    <form>
        <div class="validation-summary-valid" data-valmsg-summary="true"><span>Please correct the errors and try again.</span>
            <ul><li style="display:none"></li></ul>
        </div>
        <fieldset>
            <legend>Include</legend>
            <input name="Include" type="text" required />
        </fieldset>
        <fieldset data-js-val-prefix="Exclude">
            <legend>Exclude</legend>
            <input name="Exclude" type="text" required />
        </fieldset>
        <p><button type="submit">Submit</button></p>
    </form>
</body>
</html>

デバッグ時に役立つ可能性があるため、ライブラリの縮小版は使用していません。

助けていただければ幸いです。ありがとう

編集：

スクリプト ブロックを次のいずれかに変更すると、正常に動作します。

RequireJs なし:

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.3.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.js"></script>
<script>
    $.validator.setDefaults({
        ignore: '[data-js-val-prefix] *'
    });
</script>

目立たない JavaScript を使用しない場合:

<script>
    require.config({
        paths: {
            'jquery': 'http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.3',
            'jquery.validate': 'http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate'
        },
        shim: {
            'jquery.validate': ['jquery']
        }
    });

    require(['jquery', 'jquery.validate'], function($) {
        $.validator.setDefaults({
            ignore: '[data-js-val-prefix] *'
        });

        $(function() {
            $('form').validate();
        });
    });
</script>

これは、目立たない検証ライブラリと RequireJs の組み合わせに問題があることを示唆しています。私は何か些細な間違いをしていると確信しています。

4

1 に答える 1

7

@Sparky の助けを借りて、自分の質問に答えました。この問題は、jquery.validate.unobtrusive ファイルが検証メソッドを接続するために発生します。コールバック関数で $.validator.setDefaults を指定すると、既に検証が接続されており、無視されます。require スクリプト ブロックを次のように変更した場合:

require(['jquery', 'jquery.validate'], function($) {
    $.validator.setDefaults({
        ignore: '[data-js-val-prefix] *'
    });

    require(['jquery.validate.unobtrusive']);
});

すべてがダンディです。これが役立つことを願っています。

于 2013-06-14T14:49:44.847 に答える