jQueryプラグインでハマる

jQuery UI Datepickerを使ってハマったのでメモ。

(略)
<script type="text/javascript">
$(function() {
    $('#dateinput').detepicker({
        inline: true
    });
    $('#btnChange').click(function() {
        $.uicornerfix('6px');
        return false;
    });
)};
<form name="foo" action="bar">
<input type="text" id="dateinput" name="targetDate" value="click here"/>
</form>
</script>
（略）

上記のようなコードを書いていたが、このページがロードされたときに、$('#dateinput').detepicker is not a function.というエラーメッセージが表示された。

単体のサンプルだと正常に動くのに、システムに組み込んだ場合にエラーとなってしまうため、このページで読み込んでる共通HTMLを見てみると$関数を利用する他のライブラリを使用しているように見えたので、以下のように書き換えて$関数の上書きを元に戻し、別名でjQueryの変数を割り当ててやるようにした。

(略)
<script type="text/javascript">
// $関数の割り当てを初期化
jQuery.noConflict();
// 改めて変数を割り当てる
var $j = jQuery;
// 以降は上記のコードとほぼ同一。ただし、$変数が$j変数になっている
$j(function() {
    $j('#dateinput').detepicker({
        inline: true
    });
    $j('#btnChange').click(function() {
        $j.uicornerfix('6px');
        return false;
    });
)};
<form name="foo" action="bar">
<input type="text" id="dateinput" name="targetDate" value="click here"/>
</form>
</script>
（略）

結果、システムに組み込んだ場合でも正常に動作した。jQueryはイマイチ触り足りてないので、単純なことでもハマってしまう。もう少し勉強しなくては。