Gdy po raz pierwszy zostałem wprowadzony do Ruby on Rails byłem całkiem zdmuchnięty. Był to pierwszy framework programistyczny, którego się nauczyłem i muszę powiedzieć, że się zakochałem. Właśnie nauczyłem się jak budować aplikacje używając Sinatry i myślałem, że jest to całkiem niesamowite narzędzie, ale wtedy zobaczyłem co Rails może zrobić…
Jedną z głównych cech Rails, którą naprawdę lubiłem używać była funkcja From Helpers. Pozwoliło mi to uniknąć wypisywania całego HTML do zbudowania formularza, co z kolei dało mi możliwość tworzenia bardziej złożonych funkcji. W tym artykule zamierzam rozbić różne pomocniki formularzy dostępne w Railsach, a nawet dotknąć nowego, który został wprowadzony w wydaniu Rails 5.1.
Tworzenie formularzy za pomocą HTML może być czasem uciążliwe, szczególnie gdy są one bardzo długie i mają zbyt wiele pól wejściowych. Mogą stać się jeszcze bardziej skomplikowane, gdy formularz ma wysyłać dane do określonego punktu końcowego api lub być powiązany z modelem bazy danych. Oto formularz html do tworzenia użytkownika:
<form class="new_user" action="/users" method="post">
<label for="user_name">Name</label>
<input type="text" name="user">
<br>
<label for="user_password">Password</label>
<input type="password" name="user">
<br>
<input type="submit" name="commit" value="Create User" data-disable-with="Create User">
</form>
Jak widzisz, pisanie tego wszystkiego może stać się skomplikowane dość szybko. Jeśli przyjrzysz się bliżej formularzowi, możesz zauważyć, że przekazujemy atrybut akcji i metody do naszego formularza aby stworzyć nowego użytkownika. To jest świetne i wszystko, ale Railsy są bardzo wybredne jeśli chodzi o przesyłanie formularzy. Ten konkretny formularz nie zostałby zaakceptowany podczas przesyłania. To właśnie tutaj pomocnicy formularzy przychodzą na ratunek.
Pomocnicy formularzy
Kiedy po raz pierwszy nauczyłem się jak używać pomocników formularzy, szczerze mówiąc nie mogłem uwierzyć w to co one robią. Jak widziałeś z poprzedniego formularza, który zrobiliśmy, potrzeba trochę czasu i złożoności, aby to osiągnąć. Jednakże, z pomocnikami formularzy można to osiągnąć z dużo mniejszą ilością pracy i z całkiem sporą ilością „magii”.
Istnieją trzy różne pomocniki, które pomagają nam budować szybkie i użyteczne formularze w Railsach, form_tag, form_for, i form_with. Ostatni z nich, form_with, został wprowadzony w wydaniu Rails 5.1 i zasadniczo łączy w sobie dwa poprzednie pomocniki.
form_tag
form_tag jest najbardziej podstawowym z pomocników i z kolei robi za ciebie mniej „magii”. Nadal będzie budował formularz za ciebie, ale będziesz musiał być bardziej precyzyjny podczas deklarowania ścieżek url i jest głównie używany, gdy formularz nie jest dołączony do Controller#action. Użyjmy podstawowego formularza wyszukiwania jako przykładu:
<%= form_tag("/search", method: "get") do %>
<%= label_tag(:q, "Search for:") %>
<%= text_field_tag(:q) %>
<%= submit_tag("Search") %>
<% end %>
To wygeneruje następujący HTML:
<form accept-charset="UTF-8" action="/search" method="get">
<input name="utf8" type="hidden" value="✓" />
<label for="q">Search for:</label>
<input name="q" type="text" />
<input name="commit" type="submit" value="Search" />
</form>
Jak widzisz, deklarujemy ścieżkę, którą chcemy aby parametry formularza były przekazywane w form_tag. Możesz zobaczyć, że odbywa się to w linii <%= form_tag("/search", method: "get") do %> i możesz również zobaczyć, że określamy żądanie http. To wciąż jest całkiem niesamowite i widzisz, że Railsy dbają o wiele za nas nawet w podstawowym helperze formularzy, ale Railsy mają bardziej potężną wersję tego…
form_for
Form_for jest prawdziwą rzeczą. Ten helper pozwala nam na powiązanie formularza z obiektem, pozwalając nam na tworzenie/edycję obiektu. Jak widzieliśmy w przykładzie form_tag, musieliśmy być jednoznaczni w tym jakiej ścieżki url użyć do przesłania parametrów formularza, ale form_for pozwala nam abstrahować od tego. Oto przykład:
<%= form_for @user do |f| %> <%= f.label :name %>
<%= f.text_field :name %>
<%= f.label :password %>
<%= f.password_field :password %>
<%= f.submit %><% end %>
Wytworzy to ten sam kod, który widzieliśmy w naszym pierwszym przykładzie formularza html.
<form class="new_user" action="/users" accept-charset="UTF-8" method="post">
<input name="utf8" type="hidden" value="✓">
<input type="hidden" name="authenticity_token"
value="QPJXa5iS/XNvodHhpcwV5q42RoGFWsmZkwL3ATHFfeKqxZ8IQsLs1QjJvcrdO3BwCaOfQ4TxNLDD0b6VbxiACg=="> <label for="user_name">Name</label>
<input type="text" name="user">
<br>
<label for="user_password">Password</label>
<input type="password" name="user">
<br>
<input type="submit" name="commit" value="Create User" data-disable-with="Create User"></form>
Od razu widać, jak bardzo czysty jest ten kod przy użyciu form_for. Szczerze mówiąc, jest to trochę zaskakujące, że tak mały kod może stworzyć cały ten html, ale tak jest naprawdę! Możesz zobaczyć w pierwszej linii form_for, że przekazujemy zmienną instancji użytkownika, co spowoduje dołączenie tego formularza do tego obiektu. Inną fajną rzeczą w przekazywaniu tej zmiennej jest to, że Rails będzie szukał odpowiedniej ścieżki url po swojemu, w porównaniu do form_tag gdzie musieliśmy jawnie powiedzieć gdzie wysłać dane.
form_with
- Może porozmawiajmy o form_with i o jego użyciu
- Użyj fragmentów kodu dla przykładu
Jeśli spojrzysz na Ruby on Rails 5.1 Release Notes, jest tam notatka, że form_for i form_tag są zunifikowane w form_with. Największą korzyścią z tego nowego pomocnika jest form_with możliwość generowania tagów form na podstawie adresów URL, zakresów lub modeli
Sprawdźmy to!
form_with using URLs
Użyjmy tego samego przykładu, którego użyliśmy w form_for i zastosujmy go z form_withużywając tylko adresu URL:
<%= form_with url: user_path do |f| %>
<%= f.label :first_name %>
<%= f.text_field :first_name %>
<%= f.label :last_name %>
<%= f.text_field :last_name %>
<%= f.submit %>
<% end %>
Jak widać, jest to bardzo podobne do form_tag, gdzie określamy konkretny adres URL (user_path)
form_with using models
Naprawdę fajną rzeczą w form_with jest to, że można go również użyć do przekazywania obiektów modelu, podobnie jak w form_for.
<%= form_with model: @user do |f| %>
<%= f.label :first_name %>
<%= f.text_field :first_name %>
<%= f.label :last_name %>
<%= f.text_field :last_name %>
<%= f.submit %>
<% end %>
To utworzy ten sam HTML, który został utworzony przy użyciu form_for.
Naszą największą korzyścią z form_with jest to, że nie musimy się już martwić o decydowanie między form_tag a form_for. Mamy zgrabnego pomocnika, który pozwala nam na wykonanie obu zadań za pomocą przełącznika w pierwszej linii zadeklarowanego formularza.
Wniosek
Pomocnicy formularzy Rails są niesamowici, a nowy dodatek form_with naprawdę łączy w sobie wszystkie zalety zarówno form_tag jak i form_for. Masz teraz narzędzie, które pozwoli ci zbudować formularz w oparciu o jakiekolwiek twoje potrzeby. Niezależnie od tego czy jest to formularz wyszukiwania czy formularz do przechowywania danych w bazie danych, możesz się tym zająć dzięki Railsowym pomocnikom formularzy.
Proponowałbym również przejrzenie Przewodników po Railsach, aby dowiedzieć się o tworzeniu bardziej złożonych formularzy. Masz całkiem sporo opcji od pozwalania modelowi na akceptowanie zagnieżdżonych atrybutów, posiadanie zagnieżdżonych atrybutów i innych pomocników formularzy do tworzenia niestandardowych pól wejściowych. Jest tak wiele do zabawy podczas przechodzenia przez te dokumenty, więc skorzystaj z tego!
Happy Coding!
.