Заметки WEB-разработчика

Полезные материалы для web-разработки

Подключение js скриптов и css в yii

В этой статье речь пойдет о том, где и как правильно подключать js и css скрипты в YII

Подключение js скриптов и css в yii

Как и где подключать.

Все скрипты подключаем в главном контроллере Controller. Создаем метод beforeAction() и в нем подключаем все скрипты

protected function beforeAction($action)
{
    Yii::app()->bootstrap->register();
    $cs = Yii::app()->clientScript;
    $cs->registerCssFile(Yii::app()->request->baseUrl.'/css/style.css');
    //показываем форму
    return parent::beforeAction($action);
}

Вставка js скриптов в составе yii фреймворка

Yii::app()->clientScript->registerCoreScript('jquery');  

Вставка стороннего javascript файла в yii

Yii::app()->clientScript->registerScriptFile(Yii::app()->assetManager->publish(Yii::app()->basePath . '/js/'). '/jcarousel/lib/jquery.jcarousel.min.js', CClientScript::POS_END);  

Вставка javascript на странице

Yii::app()->clientScript->registerScript('loading', ' 
$("#loading").bind("ajaxSend", function(){ 
    	$(this).show(); 
	}).bind("ajaxComplete", function(){ 
    	$(this).hide(); 
	}); 
', CClientScript::POS_READY);  

Файл стилей css

Yii::app()->clientScript->registerCssFile(Yii::app()->assetManager->publish(Yii::app()->basePath . '/css/').'css1.css', 'screen');  

Запретить системное подключение скриптов

Например, мы сами подключаем jquery в шаблоне обычным способом: и нам не нужно, чтобы yii сам подключал jquery. Для этого делаем:

Yii::app()->clientScript->scriptMap['jquery.min.js'] = false;

Константы подключений

  • POS_READY значит, что скрипт выполнится в $(document).ready(function() { })
  • POS_LOAD - скрипт выполнится в window.onload
  • POS_END - вставка перед закрывающим тэгом body
  • POS_BEGIN - вставка перед открывающим тэгом body
  • POS_HEAD - вставка перед тэгом title

Комментарии

Комментарии через Вконтакте