Twitter-Bootstrap: Simple_form nicht machen horizontaler form oder korrigieren Sie die HTML-Ausgabe?

Ich weiß nicht, warum Ihr nicht duplizieren, wie im Beispiel. Wenn ich den folgenden code in dieser form:

<%= simple_form_for(resource, :as => resource_name, :url => registration_path(resource_name), :html => { :class => "form-horizontal" } ) do |f| %>
<%= f.input :user_name, :input_html => { :class => "span3" }, :hint => "just letters and numbers please." %>
<% end %>

Recht, jetzt sieht es wie folgt aus:

Wenn ich es will, so zu sein wie dieses (das erste Beispiel hier: http://simple-form-bootstrap.plataformatec.com.br/articles/new).

Twitter-Bootstrap: Simple_form nicht machen horizontaler form oder korrigieren Sie die HTML-Ausgabe?

Liegt das Problem in der HTML generiert wird. Mein HTML ist:

<div class="input string optional">
 <label for="user_user_name" class="string optional"> User name</label>
  <input type="text" size="50" name="user[user_name]" maxlength="25" id="user_user_name" class="string optional span3">
   <span class="hint">no spaces or special characters, just letters and numbers please</span>
</div>

Und Simple_forms HTML:

<div class="control-group string required">
 <label for="article_name" class="string required">
  <abbr title="required">*</abbr> Name
 </label>
  <div class="controls">
   <input type="text" size="50" name="article[name]" id="article_name" class="string required span6">
    <p class="help-block">add your article title here</p>
  </div>
</div>

Völlig anders. Ich denke, das Bootstrap-generator nicht erzeugen? Was denkst du? Was soll ich tun?

Ressourcen

https://github.com/plataformatec/simple_form

https://github.com/rafaelfranca/simple_form-bootstrap

http://simple-form-bootstrap.plataformatec.com.br/

InformationsquelleAutor LearningRoR | 2012-02-16

10

Haben Sie die Initialisierung für simple_form? diese Initialisierung setzt der Wrapper, der verwendet werden soll, um die Ausgabe der bootstrap-html -
```
rails generate simple_form:install --bootstrap
```
Beachten Sie, dass dies funktioniert nur mit simple_form 2!

Ja, ich habe rails generate simple_form:install --bootstrap als installation Sprach. Dies gab mir 3 Dateien: config/initializers/simple_form.rb und create config/locales/simple_form.en.yml create lib/templates/erb/scaffold/_form.html.erb
Verdammt, ich sehe jetzt. Das bundle installieren geht 1.5.2, also habe ich Sie manuell verwenden gem "simple_form", "~> 2.0.0.rc". Ich wollte nicht sehen, ganz am Anfang, sagte: "Diese Anweisungen sind für die 2.0...". Es war schwer zu erkennen, wenn Sie einfach geradeaus auf den Bootstrap-Abschnitt. Danke ahmeij.
aus der simple_form github-Seite der korrekte Befehl rails generate simple_form:install --bootstrap
Aktualisiert den post hinzufügen --bootstrap pro @Dty
Für schiene 4, die es braucht 3.0.0.rc

InformationsquelleAutor ahmeij
10

Die Ausgabe von
```
rails g simple_form:install --bootstrap
```
gibt weitere Anweisungen:
```
Inside your views, use the 'simple_form_for' with one of the Bootstrap form
classes, '.form-horizontal', '.form-inline', '.form-search' or
'.form-vertical', as the following:

  = simple_form_for(@user, :html => {:class => 'form-horizontal' }) do |form|
```
So müssen Sie die :html => {:class => 'form-horizontal' } option, um jede _form.html Datei, die Sie möchten, ändern Sie die Formular-Stil. Sie können verwenden "form-search", "form-inline', 'form-horizontal' oder 'form-vertikale" (die Standardeinstellung).

Festlegen der Standard-form, horizontal, Bearbeiten
```
lib/templates/erb/scaffold/_form.html.erb
```
und ändern Sie die erste Zeile so aus (mit Ihrem bevorzugten form class name):
```
<%%= simple_form_for(@<%= singular_table_name %>, :html => {:class => 'form-horizontal' } ) do |f| %>
```
Für diejenigen, die sich mit HAML, den Pfad der Datei und das format wird anders sein.

InformationsquelleAutor Allen
2

Ist Ihre form css "form-horizontal" in HTML ausgegeben?

Wenn nicht, ich glaube, Sie haben, wickeln Sie die Einstellung :html :class in simple_form_for tag wie diesem:
```
<%= simple_form_for(resource, :as => resource_name, :url => registration_path(resource_name), {:html => { :class => "form-horizontal" }} ) do |f| %>
```
Hoffe, es hilft.

Es funktioniert. Dank

InformationsquelleAutor Phyo Wai Win
1

Nicht sicher, warum Sie markiert @ahmeij die Antwort als korrekt.

Wird die korrekte Lösung in Ihrem Kommentar - Sie brauchen, um stellen Sie sicher, dass Sie mit simple_form version 2 und nicht die version 1. Etwa so:
```
gem "simple_form", "~> 2.0.0.rc"
```
oder Sie können es tun, wie Beispiel simple_form bootstrap-app auf github funktioniert es:
```
gem 'simple_form', git: 'git://github.com/plataformatec/simple_form.git
```
Und sofern Sie nicht die Installation der richtige Befehl ist
```
rails generate simple_form:install --bootstrap
```
InformationsquelleAutor Dty
1

Wenn Sie schauen, um dies zu tun mit simple_form v3 rc1, dann können Sie Folgen die Schritte, die ich lag hier in meinem blog. Habe gerade mal recherchiert und das und umgesetzt es:

http://www.iconoclastlabs.com/blog/using-twitter-bootstrap-3-with-simple_form

Danke, danke, danke!!!! Ich habe das ziehen der Haare aus meinem fast kahlen Kopf, den ganzen Nachmittag! Jetzt muss ich gehen Sie zurück und versuchen zu verstehen, warum dies funktionierte. BTW; ich bin mit simple_form 3.0.1 und ich musste den letzten Teil, dass Sie hoffte, Sie würden behoben werden, wenn Sie kam aus der RC.

InformationsquelleAutor GantMan
0

kopieren Sie config\Initialisierungen\simple_form.rb app,alles wird in Ordnung sein

InformationsquelleAutor user1599712
0

Habe ich versucht ganz viele verschiedene Lösungen, aber, nichts half, bis ich Hinzugefügt habe wrapper: :horizontal_form Zeile für jeden Formular-Eingaben. Und, ich habe die neueste simple_form version: 3.2.1

Beispiel:

= f.input :payment_term, wrapper: :horizontal_form

Tipp: [https://gist.github.com/chunlea/11125126/%5D%5B1%5D

InformationsquelleAutor bir_ham
0

Für simple_form ('~> 3.5') - und bootstrap-4, führen Sie die folgende änderung in simple_form_bootstrap.rb Initialisierer:
```
config.wrappers :horizontal_form, tag: 'div', class: 'form-group', error_class: 'has-error' do |b|
```
zu
```
config.wrappers :horizontal_form, tag: 'div', class: 'form-group row', error_class: 'has-error' do |b|
```
Ändern alle Formen der horizontalen, führen Sie die folgende änderung:

config.default_wrapper = :vertical_form

zu

config.default_wrapper = :horizontal_form

Und ändern nur eine form, dies zu tun:

<%= simple_form_for(@model, wrapper: :horizontal_form) do |f| %>

Außerdem können Sie brauchen, um zu ersetzen Sie alle vorkommen von control-label mit form-control-label im Initialisierer, um vertikal ausrichten der Etiketten. Quelle

InformationsquelleAutor Rajkaran Mishra

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.