simple_formのplaceholderでfont-awesomeをｊQueryでささっと表示する

個人的なメモ

simple_formのplaceholderにfont-awesomeを表示させるためにCSSにおまじないしても、input_html: => {class: "font-awesome"}みたいなことしても、ブラウザで表示したら&が文字化けして$amp#fX002とか訳の分からない表示になる。

こんなときは、jQuery使ってplaceholder入れ替えたら早い。
ということで、

<%= f.input :email, required: true, autofocus: true, placeholder: "replace to Email",
 input_html: { class: 'font-awesome' }, label: false %>

input.font-awesome {
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
}

こうして

<div class="email>
  <input placeholder="hoge" ...(他省略)>
</div>

      $(".email").find("input").attr("placeholder",$.parseHTML(" Your Email")[0].data)

こう。

これでばっちり表示される。

ちなみにコードのチートシート

チートシート