Erstelle Bearbeitungsformular mit Bootstrap

Question

In meiner Bearbeitungsansicht möchte ich Bootstrap anwenden. Wenn jedoch zu ersetzen ...

<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| %> 
    <%= devise_error_messages! %> 
    <div class="row"> 
     <div class="col-md-6"> 
     <div class="row form-group"> 
      <div class="col-md-4"><%= f.label :username %></div> 
      <div class="col-md-8"><%= f.text_field :username %></div> 
     </div> 

mit diesem ...

<div class="row"> 
    <div class="col-md-4"> 
    <div class="form-group"> 
     <label class="sr-only" for="username">Username</label> 
     <input type="text" class="form-control" name="username" placeholder="Username" value="<%= f.text_field :username %>"> 
     </div> 
    </div> 
</div> 

ich dies als Ausgangs

ich viele Alternativen ausprobiert haben erb zu schließen, aber nicht verstehen, die Problem. Wie sollte ich das Feld in meine Bearbeitungsformulare aufnehmen?

Answer 1

können Sie alle Dinge mit Schienen tun.

<div class="row"> 
    <div class="col-md-4"> 
    <div class="form-group"> 
     <%= f.label :username %> 
     <%= f.text_field :username, class: "form-control", placeholder: "Username" %> 
     </div> 
    </div> 
</div> 

Für weitere Details besuchen Sie bitte diesen Link

http://apidock.com/rails/ActionView/Helpers/FormHelper/text_field

Wenn Sie Add-on Sie dieses stattdessen unter

<div class='input-group' > 
      <%= f.text_field :username, class: "form-control", placeholder: "Username" %> 
      <span class="input-group-addon" id="basic-addon2">@example.com</span> 
</div> 

Answer 2

Versuchen

<div class="row"> 
    <div class="col-md-4"> 
    <div class="form-group"> 
     <label class="sr-only" for="username">Username</label> 
     <%= f.text_field :username, class: "form-control", placeholder: "Username" %> 
     </div> 
    </div> 
</div> 

können verwenden möchten

Answer 3

Ich würde vorschlagen, ein Juwel namens simple_form zu verwenden, es wurde von den Machern von Devise gemacht und funktioniert gut mit Bootstrap. Es hat auch schöne Validierungsfehler.

https://github.com/plataformatec/simple_form

Hier ist ein Beispiel:

= simple_form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| 
     .form-inputs 
     = f.input :email, required: false, autofocus: true, placeholder: 'Email' 
     = f.input :password, required: false, placeholder: 'Password' 
     = f.input :remember_me, as: :boolean, label: 'Remember Me' if devise_mapping.rememberable? 
     .form-actions 
     = f.button :submit, 'Sign in', class: 'btn-block btn-success' 
     %br 
     = link_to 'Forgot your password?', new_user_password_path 

Der obige Code automatisch alle Bootklassen und Etiketten hinzufügen ... etc