Clipを使ったビューの記述 - knight

はじめに

Yiiでは、ウィジェットを使ってビューを作り込んでいくのが主流の方法ですが、ちょっとしたビューを作成するにはクリップを使う方法が便利だと思います。
実はYii-janの方に書いたのですが、どうも反映されないようなので、こちらに記述しました。

Clipのサンプル

コントローラのサンプル

<?php
// controllers/SampleClipController.php
class SampleClipController extends Controller {
    public $layout='//layouts/samplelayout';

    public function actionIndex() {
        $this->render('index'); 
    }
}
?>

コントローラで指定したsamplelayoutは、次のようになります。

// views/layouts/samplelayout.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>pageTitle); ?></title>
<?php echo $this->clips['head_clip']; ?>
</head>
<body class="base">
<?php echo $content; ?>
</body>
</html>

ヘッダ部にある、$this->clips['head_clip'];がポイントです。そして、コントローラから読み込まれる具体的なビュー index.phpは、以下のようになります。

// views/sampleClip/index.php
<:?php $this->beginClip('head_clip'); ?>
<script>
function change() {
document.getElementById('message').innerHTML = "Changed!";
}
</script>
<?php $this->endClip(); ?>
<div id="message">
HELLO!
</div>
<a href="javascript:void(0)" onClick="change();">Change</a>

ビューに記述されているbeginClip〜endClipの内容は、レイアウト上でecho $this->clips...のところに表示れます。これで、特定のページ(index.php)だけに、ヘッダ部にそのページ用のjavascriptを埋め込むことが出来ます。

最終的にレンダリングされるhtmlファイルは、次のようになります。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>My Web Application - SampleClip</title>
<script>
function change() {
document.getElementById('message').innerHTML = "Changed!";
}
</script>
</head>
<body class="base">
<div id="message">
HELLO!
</div>
<a href="javascript:void(0)" onClick="change();">Change</a>
</body>
</html>

ClientScriptとの比較

JavaScriptに関してだけ言うと、Yiiらしい書き方は

<?php
$script = <<< JS
function change() {
document.getElementById('message').innerHTML = "Changed!";
}
JS;
Yii::app()->clientScript->registerScript('1',$script,CClientScript::POS_HEAD);
?>
<div id="message">
HELLO!
</div>
<a href="javascript:void(0)" onClick="change();">Change</a>

になりますが、ヘッダやフッタなどにそのページ固有のボタンを出すなどの処理を入れたい場合は、clipを使うのが良いのではないかと思います。