smarty + javascript

こんばんは。
フロントエンドエンジニアのtakakiです。

smartyベースでソシャゲなんかを作ってますと、smartyにアサインされた値をjsに渡したいことがありますよね。

<script>
  {literal}
    userId = {/literal}{$userId}{literal};
  {/literal}
</script>

こんな風にしてグローバルに置いて外部jsから触れる様にすると思います。

が、これやると、{$userId}がnullの時にバグるので要注意！
どういうことかというと、{$userId}がnullだと、jsは

  userId =;

こうなるからです。
これを防ぐには<script>
タグより前に、

{if !$userId}
  {assign var="userId" value="null"}
{/if}

と書いておけば解決します。
valueに文字列のnullをセットするのがミソです。
これを普通のnullにしちゃうと、

  userId =;

これのまんまになりますからね。

あるいは、<div id=”main-container”>かなんかに、

<div id="main-container" data-user-id="{$userId}">
  <!-- 略 -->
</div>

こうやってセットしておけばjQueryで簡単に取得できますね。書きながらいま気づきましたけど。
外部jsなどからこのuserIdにアクセスするには、以下のように書いてください。

var userId = $("div#main-container").data("user-id");