先日この記事で動的なクラス名をつける方法を解説したが
はまりポイントがあったため、追加で書きます。
ハマりポイント
前回の記事で解説した下記のコード、、、複数のクラス名指定ができません。
class=<%= "section#{question.id}" %>
例えばこのように
class=<%= "section#{question.id} btn btn-default" %>
書くと、class="section1" btn btn-defaulとレンダリングされてしまいます。
原因
単純なHTMLの書き方の問題です。
上記の書き方だと、レンダリングされたときにclass= section1 btnとなってしまうため、HTMLの性質上、一つしか読み込まれません。
ですので
class="<%= "section#{question.id} btn btn-default" %>"
このようにしっかり、class="<%= ~ %>"と書けば全てのクラス名が読み込まれます。
簡単な話ですが、案外気づきにくいポイントかなと思ったのでまとめてみました。
「viewからHTMLが作成されるときにどう解釈されるのか？どうコードに変更されるのか？」を意識すれば似たようなミスも防げるかと思います。