Rails best_in_place gem with Material Design Lite

Question

Im trying to incorporate the best_in_place gem and got everything working, but now Im trying to get it to use material design lite to style the input when it is clicked.

Here is the html for the view:

<h2><%= best_in_place @user, :displayname, :as => :input %></h2>

And this is what the html would be for a normal text input with MDL:

<div class="mdl-textfield mdl-js-textfield">
    <input class="mdl-textfield__input" type="text" id="sample1">
    <label class="mdl-textfield__label" for="sample1">Text...</label>
</div>

Cant figure out what options to make this work with the best_in_place gem

Answer 1

I dont have the "best_in_place gem".

This is a solution I used to style a form containing an email input. I replaced the entire MDL "input" line. You would have to replace the "id"/ "for" relation and email field to something relevant to your purpose. You may have to fiddle around. Hope it points you in the right direction.

---

<%= form_for(@user) do |f| %>
  <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">          
    <%= f.email_field :email, class:'mdl-textfield__input', type:'text', id:'email' %>
    <label class="mdl-textfield__label" for="email">EMAIL</label>
  </div>
<% end %>