Intereting Posts

Как использовать jQuery AJAX для внешнего домена? Octal для ввода строки из массива Разрешить загрузке страницы только в iframe и предотвращать прямой доступ Вставка PHP в результаты HTML в код с комментариями Что лучше по производительности: двойные кавычки с переменными или одинарные кавычки с конкатенациями? Группы опций в форме формы объекта symfony2 Файловая система недоступна для записи Проблема при настройке сервера сокетов как рассчитать разницу во времени в PHP перенос данных формы php в окно js как получить загруженный путь изображения в php и ajax? Добавление ведущего 0 в php Безопасное извлечение вывода для обоих полей html и ввода Как использовать str_replace () для удаления текста определенное количество раз только в PHP? Разница между CMS (joomla, drupal) и Frameworks (Zend, Symfony, CI)

Включить jQuery в Symfony2

Я новичок в области Symfony2 и не совсем понимаю, как работать с javascripts и как их наилучшим образом включить.

Что мне нужно: включить скрипт jQuery на каждую страницу.

Что у меня: у меня есть общий макет:

<!DOCTYPE html> <html> <head> {% block javascripts %}{% endblock %} </head> <body> {% block body %}{% endblock %} </body> </html>

Где должен быть размещен jquery.js. Как насчет web / bundles / jquery ? Или есть специальные специальные пакеты jquery? Должен ли я использовать asset () и как?

Solutions Collecting From Web of "Включить jQuery в Symfony2"

Предполагая, что ваш jquery.min.js помещен под src/Acme/FooBundle/Resources/public/js/

Вы можете использовать либо

 <script type="text/javascript" src="{{ asset('bundles/acmefoo/js/jquery.min.js') }}"></script>

или

 {% javascripts '@AcmeFooBundle/Resources/public/js/jquery.min.js' %} <script type="text/javascript" src="{{ asset_url }}"></script> {% endjavascripts %}

В шаблон вашей ветки.

Убедитесь, что впоследствии вы установили активы или запустите эту команду

 php app/console assets:install web --symlink

Существует несколько способов включить jQuery в проект Symfony. Ты можешь:

1. Установите jQuery с помощью диспетчера пакетов интерфейса (Bower)

В документации Symfony указано:

Bower – это инструмент управления зависимостями для интерфейсных зависимостей, таких как Bootstrap или jQuery .

Если Bower еще не установлен, вы можете установить его глобально с помощью npm (require node):

 npm install -g bower

Согласно документации Symfony :

Пакет не должен вставлять сторонние библиотеки, написанные на JavaScript, CSS или на любой другой язык.

Таким образом, мы храним jQuery непосредственно в каталоге web/ который является общедоступным. Чтобы сообщить Бауэру, где устанавливать пакеты, создайте файл .bowerrc в корне проекта проекта Symfony с этим контентом:

 { "directory": "web/assets/vendor/" }

Выполните bower init bower bower init в корне вашего проекта, чтобы создать bower.json, который определит установленные пакеты. Введите ввод для каждого вопроса, чтобы ответить на значение по умолчанию (выберите «globals» для типа модулей).

Bower готов к установке jQuery в ваш проект:

 bower install --save jquery

Теперь вы можете включить jQuery в свой шаблон:

 <script src="{{ asset('assets/vendor/jquery/dist/jquery.min.js') }}"></script>

В настоящее время у Bower нет функции блокировки, например, на Composer . Вот почему вы, вероятно, должны передать активы, загруженные Bower, вместо добавления каталога в ваш .gitignore-файл. Вероятно, это изменится в будущем: беседка / беседка № 1748 .

2. Установите jQuery с помощью Composer

Даже если Composer является менеджером зависимостей для PHP, вы также можете использовать его для установки jQuery.

Чтобы Composer смог установить компоненты, такие как компоненты / jquery , вам нужно сначала добавить компонент-установщик :

 composer require robloach/component-installer

Затем измените файл composer.json, чтобы включить:

 "require": { "components/jquery": "3.1.1" }, "config": { "component-dir": "web/assets/vendor" },

и выполнить composer install . Это установит jQuery в каталоге web/assets/vendor .

Затем вы можете включить jQuery в свой шаблон:

 <script src="{{ asset('assets/vendor/jquery/jquery.min.js') }}"></script>

3. Включите jQuery из CDN

Например, с помощью Google CDN:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

О преимуществах и недостатках использования CDN я предлагаю вам прочитать эту страницу .

В любом случае:

Чтобы убедиться, что ваши скрипты (которые требуют jQuery) будут работать, сначала необходимо загрузить jQuery. Поэтому, в зависимости от требований загрузки страницы, вы должны:

включить jQuery прямо перед тем, как он вам понадобится, или
включить его в <HEAD> , или
использовать отсрочку в своих сценариях

Ради чистоты. Конечно, теги <script> должны быть закрыты, поэтому правильные фрагменты кода:

 <script type="text/javascript" src="{{ asset('bundles/acmefoo/js/jquery.min.js') }}"></script>

а также

 {% javascripts '@AcmeFooBundle/Resources/public/js/jquery.min.js' %} <script type="text/javascript" src="{{ asset_url }}"></script> {% endjavascripts %}

В противном случае весь контент страницы будет рассматриваться как содержимое тега script и будет выглядеть пустым.

Для реализации с пакетом композитора перейдите к своему пакету symfony и выполните следующие команды.

Загрузить пакет поставщика:

Пакет, который вы выбираете, зависит от вас, я использую популярный пакет (bmatzner / jquery-bundle) для этого примера.

php composer.phar require bmatzner/jquery-bundle:2.* для jQuery 2.x

или

php composer.phar require bmatzner/jquery-bundle:1.* для jQuery 1.x

Добавьте Bundle в AppKernel:

 /* /app/AppKernel.php */ class AppKernel extends Kernel { public function registerBundles() { $bundles = [ new Bmatzner\JQueryBundle\BmatznerJQueryBundle(), ///...

Установка активов:

php bin/console assets:install --symlink web

Чтобы включить в шаблон:

 <!-- /app/Resources/views/base.html.twig --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>{% block title %}Welcome!{% endblock %}</title> {% block stylesheets %}{% endblock %} <script type="text/javascript" src="{{ asset('bundles/bmatznerjquery/js/jquery.min.js') }}"></script> <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" /> </head> <body> {% block body %}{% endblock %} {% block javascripts %}{% endblock %} </body> </html>

Очистить кэш:

 php bin/console cache:clear --env=dev php bin/console cache:clear --env=prod