22

Czy istnieje jakiś klejnot do budowania formularzy kompatybilnych z Rails 4, który zapewnia kompleksową obsługę formularzy Twitter Bootstrap 3.0.0?Rails 4 Form Builder z wszechstronnym wsparciem dla Twittera Bootstrap 3

Oto odniesienia dla co Pomyślę „kompleksowe” Wsparcie:

  • wsparcie dla wszystkich 3 układach (podstawowy, poziomy, inline)
  • Wsparcie dla podstawowych typów (wejście, textarea, wybierz itp)
  • Wsparcie dla obu sterach & inline wyboru/przyciski radiowe
  • wsparcie dla wszystkich stanów wejściowych (Focus, niepełnosprawnych, zatwierdzanie)
  • Wsparcie tekst pomocy/ER ror messaging
  • Obsługa input-append/prepend (obecnie określana jako grupa wejściowa w TWBS3).
  • Obsługa obsługi elementów "formularza" specyficznych dla Railsów, np. date_select (inline wybierz pudełka)

Zobacz TWBS3 docs i WIP github issue Szczegółowe informacje na temat form TWBS3.

Spojrzałem na oba modele: simple_form i twitter_bootstrap_form_for i chociaż oba robią postępy, nie wydaje się, aby obecnie oferowały wystarczające rozwiązanie.

Prosta forma

wydaje się mieć rozwiązanie dla podstawowego układu, jednak z tego co widzę formy poziome nie są możliwe ze względu na dodatkowe znaczniki siatki wymaganej przez TWBS3.

https://github.com/plataformatec/simple_form/pull/864 https://github.com/plataformatec/simple_form/issues/857

Twitter forma bootstrap dla

Ta prośba przyciąganie wygląda obiecująco, ale widzę pewne nieścisłości w znacznikach i klas używane.

https://github.com/stouset/twitter_bootstrap_form_for/pull/84

+0

jakikolwiek postęp w tej sprawie? – caarlos0

+2

Rozwinąłem wersję twitter_bootstrap_form_for z żądania ściągnięcia (ponieważ opiekun prawdopodobnie przekazuje projekt) i poczyni pewne poprawki. Nie jestem jednak całkiem zadowolony z API (a kod jest nieco niechlujny), więc nie planuję używać go na dłuższą metę, ale na razie używam go. https://github.com/tommarshall/twitter_bootstrap_form_for. Palce przekroczyły kogoś, kto wie o czymś lepszym. – tommarshall

+0

Dzięki! Spojrzę na to. Pozdrowienia – caarlos0

Odpowiedz

1

Próbowałem niedawno, istnieją pewne sztuczki, aby uzyskać simple_form pracy, chciałbym powiedzieć, że nie jest jeszcze w pełni gotowe. Sprawdź ponownie prosty formularz za kilka tygodni, w międzyczasie możesz budować swój język ręcznie lub mieszać się z niezręcznymi formularzami za pomocą simple_form, dopóki nie zostanie zaktualizowany.

Można monitorować jego postępy tutaj: https://github.com/rafaelfranca/simple_form-bootstrap/pull/28

7

w moim własnym doświadczeniu z bootstrap i simple_form/podejście form_builder że simple_form nie jest warta. Jest zbyt wiele rzeczy, które w prostej formie nie mają odpowiedzi na układ i kontrolę, niektóre kluczowe czarne punkty to klasy na znacznikach otoki, wybierają atrybuty html lub robią coś prostego, jak na przykład grupy przycisków ładowania, które naśladują przełączniki/przyciski opcji. Obsługa i18n w simple_form była również wyzwaniem, wymagającym dużego nakładu pracy.

Należy również rozważyć, czy renderowanie po stronie serwera jest właściwym rozwiązaniem dla nowoczesnej aplikacji.Przechodzę z tradycyjnego renderowania po stronie rails/po stronie serwera do modelu SPA (Single Page Application). Aby to zrobić, używam backbone.js i marionetki z szablonami eco i coffeescript.

Podejście architektoniczne do budowania formularzy typu simple_form/rails wydaje się być wadliwe, aw jego ramach znajduje się wiele zawiłych kodów służących do konstruowania fragmentu łańcucha html.

Cóż, mówię, że do tego służą szablony widoków!

Pod koniec dnia widok składa się z wielu różnych szablonów podrzędnych (np. Częściowych) i myślę, że powinien on przejść od razu do elementów sterujących/pól. W przeciwieństwie do tego, podejście konstruktora jest zawsze wychwytywane z brakiem wsparcia dla różnych komponentów jquery i nie jest wystarczająco elastyczne, aby nadążyć.

Proponuję użyć sparametryzowanych szablonów/częściowych widoków, które kodyfikują znaczniki, które chcesz dla każdego typu kontrolki/komponentu lub konstrukcji widoku w twojej aplikacji i po prostu komponuj je, aby uzyskać pożądany układ. Jeśli robisz to po stronie serwera, możesz zawrzeć wszystkie częściowe wywołania renderowania za pomocą niektórych pomocników dla syntaktycznej słodyczy. Jeśli robisz to po stronie klienta przy użyciu szablonów eco, sprawdź main page, zobaczysz tam przykład definiowania i wywoływania szablonów tworzenia formularzy.

Nie zamykaj się w możliwościach kreatora formularzy, skorzystaj z przykładów dokumentacji boostrap jako punktu wyjścia do tworzenia szablonów i po prostu zadzwoń do nich!

5

Czy wymeldowałeś się https://github.com/potenza/bootstrap_form? Właśnie dodaliśmy obsługę Bootstrap 3 i jest bardzo lekka.

Obsługujemy prawie wszystkie Twoje wymagania, ale wciąż pracujemy nad dobrym rozwiązaniem do wyboru daty i czasu, ponieważ są one domyślnie ustawiane w stos.

Oto przykładowy formularz w erb:

<%= bootstrap_form_for(@user) do |f| %> 
    <%= f.email_field :email %> 
    <%= f.password_field :password %> 
    <%= f.check_box :remember_me %> 
    <%= f.submit "Log In" %> 
<% end %> 

a wyjście:

<form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post"> 
    <div class="form-group"> 
    <label for="user_email">Email</label> 
    <input class="form-control" id="user_email" name="user[email]" type="email"> 
    </div> 
    <div class="form-group"> 
    <label for="user_password">Password</label> 
    <input class="form-control" id="user_password" name="user[password]" type="password"> 
    </div> 
    <div class="checkbox"> 
    <label for="user_remember_me"> 
     <input name="user[remember_me]" type="hidden" value="0"> 
     <input id="user_remember_me" name="user[remember_me]" type="checkbox" value="1"> Remember me 
    </label> 
    </div> 
    <input class="btn btn-default" name="commit" type="submit" value="Log In"> 
</form> 
+0

Cieszę się, że natknąłem się na to, musiałem wyrwać kawał kawałka prostego hackery! Dzięki za klejnot! –

+0

Znalazłem 'bootstrap3-datetimepicker-rails' jako całkiem niesamowite rozwiązanie do wybierania czasu z przyjaznym interfejsem BS3. Musiałem wykonać kilka konwersji params, jak w przykładzie: 'params [: event] [: starttime] = DateTime.strptime (parametry [: event] [: starttime], '% m /% d /% Y% I:% M% p '), jeśli params [: event] [: starttime] .present? ' – Archonic