More than 3 years have passed since last update.

form.labelで文字をエスケープしたときの実装メモ

Last updated at 2020-09-10Posted at 2020-09-10

<%= form.label :title, "件名", for: "title" %>
<%= form.text_field :title, id: "title", placeholder: "件名を入力してください" %>

上記のlabelの中の件名を<span>件名<span>としたい。(bootstrapをあてる関係で)
しかし

<%= form.label :title,"<span>件名</span>", for: "title" %>

としても意図した挙動にはならない。
これはhtmlタグが文字列として認識されてしまうから。
なので"件名"の部分だけエスケープさせたい。
エスケープで検索すると、html_safe、raw、sanitize等いくつかメソッドがあるとのこと。

Railsガイドより、

html_safeやrawではなく、後述の#sanitizeメソッドを使うことが推奨されています。セキュリティ上の問題が生じるため、ユーザー入力に対して#html_safeや#rawを使ってはいけません。

とあることから
ユーザー情報を入力するためのinputタグなどにはsanitizeメソッドを、ユーザー情報以外であればhtml_safeやrawを使うっぽい。

ユーザー情報入力フォーム　→　sanitize
ユーザー情報以外の入力フォーム　→　raw
入力フォーム以外　→　html_safe

こんな感じ？？

実際のオプションの指定の仕方はhttps://api.rubyonrails.org/を参考に、以下のように実装したら期待した表示に。

<%= form.label :title, '<span>件名</span>'.html_safe, for: "title" %>
<%= form.text_field :title, id: "title", placeholder: "件名を入力してください" %>

ちなみに

https://api.rubyonrails.org/
でlabelを検索すると
ActionView::Helpers::FormBuilderのlabelとActionView::Helpers::FormHelperのlabelが引っかかった。
この違いって何？？？と悩んだのでメモ

FormHelperはform_tag
FormBuilderはform_fom、form_with

今回はレシーバがフォームヘルパオブジェクトじゃなくてフォームビルダオブジェクトになるので、FormBuilderのlabelのオプション指定を調べて実装する必要があった。

obj.method

こういう記載があるところの

obj(レシーバ).method(メソッド)

この前の部分。

aaa.label_tag("hoge".html_safe)
上記だとこのaaaの部分。

今回だとform_withで実装しているため、form.labelのレシーバはFormBuilder