Как подключать скрипты javascript в Yii2

1. Подключение прямо в коде вида (inline js)

Во view можно подключить произвольный javascript код вот так:

<span class="hljs-variable">$var</span> = <span class="hljs-number">123</span>;
<span class="hljs-comment">//начало многосточной строки, можно использовать любые кавычки</span>
<span class="hljs-variable">$script</span> = <<< JS
    <span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">foo</span><span class="hljs-params">()</span> </span>{
        <span class="hljs-keyword">return</span> <span class="hljs-variable">$var</span>; <span class="hljs-comment">//можно использовать переменные</span>
    }
JS;
<span class="hljs-comment">//маркер конца строки, обязательно сразу, без пробелов и табуляции</span>
<span class="hljs-variable">$this</span>->registerJs(<span class="hljs-variable">$script</span>, yii\web\View::POS_READY);

В браузере такая вставка в итоге окажется сразу перед закрытием body:

<span class="hljs-tag"><<span class="hljs-title">script</span> <span class="hljs-attribute">type</span>=<span class="hljs-value">"text/javascript"</span>></span><span class="javascript">
jQuery(<span class="hljs-built_in">document</span>).ready(<span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
    <span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">foo</span>(<span class="hljs-params"></span>) </span>{
        <span class="hljs-keyword">return</span> <span class="hljs-number">123</span>;
    }
});</span><span class="hljs-tag"></<span class="hljs-title">script</span>></span>
<span class="hljs-tag"></<span class="hljs-title">body</span>></span>

Или например, так приходится вставлять скрипт colorbox, когда мы хотим иметь на странице несколько галерей colorbox.

$script = <<< JS
    jQuery('a.album$model->id').colorbox({ opacity:0.5, rel:'port$model->id', maxWidth:800, maxHeight:600, loop:false });
JS;
//маркер конца строки, обязательно сразу, без пробелов и табуляции
$this->registerJs($script, yii\web\View::POS_END);

Вообще возможные варианты места подключения скрипта: (документация)

POS_HEAD
POS_BEGIN: после тэга <body>
POS_END: перед тэгом </body>
POS_LOAD: оборачивается в jQuery(window).load(). Note that by using this position, the method will automatically register the jQuery js file.
POS_READY: оборачивается вjQuery(document).ready(). This is the default value. Note that by using this position, the method will automatically register the jQuery js file.

2. Подключение js-файла скрипта

Вставляем все функции javascript в один файл или в несколько, смотря где надо какие функции подключать. И потом в макете, или виде, где необходимо эти функции вызвать, подключаем файл скрипта.

<span class="hljs-variable">$this</span>->registerJsFile(<span class="hljs-string">'url/to/file.js'</span>,  [<span class="hljs-string">'position'</span> => yii\web\View::POS_END]);

8 марта 2016, Программирование, веб-кодинг

По мотивам – http://fncy.ru/yii2-javascript