新しいブログに引っ越しました

tomotomoSnippetは新しいブログに移動しました
http://develtips.com/

2010-01-18

[CakePHP]Javascriptヘルパーを拡張したい

CakePHP1.2で外部Javascriptファイルを読み込むのに、Javascriptヘルパーを使って出力しますが、元のヘルパーだと、charset属性を指定できません。


View:
$javascript->link('http://maps.google.com/maps?file=api&v=2&hl=ja&sensor=false&key=XXXX', false);


Html:
<script type="text/javascript" src="http://maps.google.com/maps?file=api&v=2&hl=ja&sensor=false&key=XXXX"></script>


という事で、さっさとヘルパーを拡張することにしました。
CakePHP Formヘルパの拡張 その1日本語日付選択プルダウンを参考にすると、継承元のクラス名は必ずしもAppHelperでなくて良いようだ。

これなら必要な機能だけ拡張、または上書きすれば良さそう。
という事で、早速Javascriptヘルパーのlinkメソッドをコピーして、ちょちょっと書きなおしたコードがコレ。
// APP/views/helpers/ex_javascript.php

class ExJavascriptHelper extends JavascriptHelper
{
function link($url, $inline = true, $attr = array())
{
// (省略)

$htmlattributes = '';
foreach ($attr as $k => $v) {
$htmlattributes .= ' '.$k.'="'.$v.'"';
}

//$out = $this->output(sprintf($this->tags['javascriptlink'], $url));
$out = $this->output(sprintf('<script type="text/javascript" src="%s"%s></script>', $url, $htmlattributes));

// (省略)
}
}

第3引数にHTML属性を指定できるようにしました。


これでよし!と思ったら一つ問題が・・・
コントローラで、元のJavascriptヘルパーも併せてセットしないと動かないことが発覚。
var $helpers = array('Javascript','ExJavascript');


継承してるのに2つともインスタンス化しちゃうのはなんだかなぁ
ということで、先ほどのコードをちょっと書き換えます。

// APP/views/helpers/ex_javascript.php

// まずは元のJavascriptヘルパーファイルを読み込む
require_once CAKE.'libs'.DS.'view'.DS.'helpers'.DS.'javascript.php';

class ExJavascriptHelper extends JavascriptHelper
{
function link($url, $inline = true, $attr = array())
{
// (省略)

$htmlattributes = '';
foreach ($attr as $k => $v) {
$htmlattributes .= ' '.$k.'="'.$v.'"';
}

#$out = $this->output(sprintf($this->tags['javascriptlink'], $url));
$out = $this->output(sprintf('<script type="text/javascript" src="%s"%s></script>', $url, $htmlattributes));

// (省略)
}
}


Controller:
var $helpers = array('ExJavascript');


View:
$exJavascript->link('http://maps.google.com/maps?file=api&v=2&hl=ja&sensor=false&key=XXXX', false, array('charset'=>'UTF-8'));


Html:
<script type="text/javascript" src="http://maps.google.com/maps?file=api&v=2&hl=ja&sensor=false&key=XXXX" charset="UTF-8"></script>


期待通りの動きが実現できました。

0 件のコメント:

コメントを投稿

人気のエントリー