web-dev-qa-db-ja.com

Symfony2 / TwigでJavaScriptを使用する

Contact.html.twigというビューがあります。いくつかのテキストフィールドがあるフォームがあります。 javascriptを使用して、空のフィールドがないこと、およびその他のルールを検証したいと思います。しかし、定義とともに.jsをどこに置くべきかわかりません。 Twig表記を使用して.jsスクリプトを呼び出す方法もわかりません。

javascriptsymfonytwig
12
camelCase

これは、JavaScriptを処理する方法の一般的な答えです...特に検証部分ではありません。私が使用するアプローチは、次のように、バンドル_Resources/public/js_ディレクトリのプラグインとして個々の機能を個別のJSファイルに保存することです。

_(function ($) {

    $.fn.userAdmin = function (options) {
        var $this = $(this);

        $this.on('click', '.delete-item', function (event) {
            event.preventDefault();
            event.stopPropagation();

            // handle deleting an item...
        });
    }
});
_

次に、asseticを使用してこれらのファイルをベーステンプレートに含めます。

_{% javascripts
    '@SOTBCoreBundle/Resources/public/js/user.js'
%}
    <script src="{{ asset_url }}"></script>
{% endjavascripts %}
_

基本テンプレートでは、_<body>_の最後に$(document).ready();のブロックがあります。

_<script>
    $(document).ready(function () {
        {% block documentReady %}{% endblock documentReady %}
    });
</script>
</body>
_

次に、「ユーザー管理」機能を備えた私のページで、次のようにuserAdmin関数を呼び出すことができます。

_{% block documentReady %}
    {{ parent() }}
    $('#user-form').userAdmin();
{% endblock documentReady %}
_
24
MDrollette

クライアント側の検証には、基本的なHTML5機能で十分ではありませんか？これは、フォームコンポーネントによって提供されます。次のことも確認できます。

1
Codium