Alai

Amikor először mutatták be a Ruby on Rails-t, eléggé el voltam ájulva. Ez volt az első programozási keretrendszer, amit megtanultam, és azt kell mondanom, hogy némileg beleszerettem. Éppen megtanultam, hogyan kell alkalmazásokat készíteni a Sinatra segítségével, és úgy gondoltam, hogy az egy elég nagyszerű eszköz, de aztán láttam, hogy a Rails mire képes…

A Rails egyik fő funkciója, amit nagyon élveztem használni, a From Helpers volt. Ez lehetővé tette számomra, hogy elkerüljem az összes HTML kiírását egy űrlap létrehozásához, és cserébe lehetőséget adott összetettebb funkciók megvalósítására. Ebben a cikkben a Rails által biztosított különböző űrlap-segédprogramokat fogom lebontani, és még egy új, a Rails 5.1 kiadásban bevezetett űrlapot is érintek.

A HTML-formanyomtatványok létrehozása időnként kellemetlen lehet, különösen, ha extra hosszúak, túl sok beviteli mezővel. Még trükkösebbé válhatnak, ha az űrlapnak adatokat kell küldenie egy adott api végpontra, vagy egy adatbázis-modellhez kell kapcsolódnia. Íme egy html űrlap egy felhasználó létrehozásához:

<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>

Amint láthatod, mindezek kiírása elég gyorsan bonyolulttá válhat. Ha jobban megnézzük az űrlapot, láthatjuk, hogy egy action és egy method attribútumot adunk át az űrlapunknak egy új felhasználó létrehozásához. Ez nagyszerű, meg minden, de a Rails szuper válogatós, amikor az űrlapok elküldéséről van szó. Ez a bizonyos űrlap nem kerülhetett be a vizsgálatba, amikor elküldtük. Itt jönnek a segítségünkre a Form helpers.

Form helpers

Amikor először tanultam meg használni a Form helpers-t, őszintén szólva nem hittem el, hogy mit tudnak. Ahogy az előző űrlapon is láthattad, amit csináltunk, némi időt és összetettséget igényel. A form-segítőkkel azonban ez sokkal kevesebb munkával és elég sok “varázslattal” elérhető.

Három különböző segítő van, amelyek segítenek nekünk gyors és hasznos űrlapokat készíteni a Railsben: form_tag, form_for és form_with. Az utolsó, a form_with a Rails 5.1 kiadásakor került bevezetésre, és lényegében az előző két segédet egyesíti.

form_tag

A form_tag a legalapvetőbb segéd, és viszont kevesebb “varázslatot” végez helyettünk. Továbbra is felépíti az űrlapot helyetted, de egyértelműbbnek kell lenned az url elérési útvonalak deklarálásakor, és főleg akkor használatos, ha az űrlap nem kapcsolódik egy Controller#actionhez. Használjunk példaként egy egyszerű kereső űrlapot:

<%= form_tag("/search", method: "get") do %>
<%= label_tag(:q, "Search for:") %>
<%= text_field_tag(:q) %>
<%= submit_tag("Search") %>
<% end %>

Ez a következő HTML-t fogja generálni:

<form accept-charset="UTF-8" action="/search" method="get">
<input name="utf8" type="hidden" value="&#x2713;" />
<label for="q">Search for:</label>
<input name="q" type="text" />
<input name="commit" type="submit" value="Search" />
</form>

Amint láthatod, a form_tag-ben deklaráljuk az útvonalat, amit az űrlap paramétereinek átadásához szeretnénk. Láthatjuk, hogy ez a <%= form_tag("/search", method: "get") do %> sorban történik, és azt is láthatjuk, hogy megadjuk a http kérést. Ez még mindig elég félelmetes, és láthatjuk, hogy a Rails már az alap form-segédprogramban is sok mindent elintéz helyettünk, de a Rails-nek van egy sokkal erősebb változata is…

form_for

A form_for az igazi. Ez a segédprogram lehetővé teszi számunkra, hogy egy űrlapot egy objektumhoz kössünk, lehetővé téve számunkra egy objektum létrehozását/szerkesztését. Ahogy a form_tag példában láttuk, explicitnek kellett lennünk abban, hogy melyik url elérési utat használjuk az űrlap paramétereinek elküldéséhez, de a form_for lehetővé teszi, hogy ezt absztraháljuk. Íme egy példa:

<%= form_for @user do |f| %> <%= f.label :name %>
<%= f.text_field :name %>
<%= f.label :password %>
<%= f.password_field :password %>
<%= f.submit %><% end %>

Ez ugyanazt a kódot fogja eredményezni, amit az első példánkban láttunk egy html űrlapról.

<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>

Rögtön láthatjuk, hogy mennyivel tisztábban néz ki ez a kód a form_for használatával. Őszintén szólva egy kicsit megdöbbentő, hogy egy ilyen kis kód képes ennyi html-t létrehozni, de tényleg így van! A form_for első sorában láthatjuk, hogy átadjuk a felhasználó egy példányváltozóját, ami ezt az űrlapot az adott objektumhoz csatolja. A másik klassz dolog ennek a változónak az átadásában az, hogy a Rails magától meg fogja keresni a megfelelő url elérési útvonalat, szemben a form_tag-vel, ahol kifejezetten meg kellett mondanunk neki, hogy hova küldje az adatokat.

form_with

• Majd beszéljünk a form_with-ről és a használatáról
• Kódrészleteket használjunk például

Ha megnézzük a Ruby on Rails 5.1 Release Notes-t, van egy megjegyzés, hogy a form_for és a form_tag egyesül a form_with-be. Ennek az új segédprogramnak a legnagyobb előnye, hogy form_with képes URL-ek, hatókörök vagy modellek alapján űrlapcímkéket generálni

Nézzük meg!

form_with using URLs

Vegyük ugyanazt a példát, amit a form_for-ben használtunk, és alkalmazzuk a form_withel, csak egy URL-t használva:

<%= 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 %>

Mint láthatjuk, ez nagyon hasonló a form_tag-hoz, ahol egy konkrét URL-t adunk meg (user_path)

form_with using models

Az igazán klassz dolog a form_with-ben, hogy a form_for-hez hasonlóan modellobjektumok átadására is használható.

<%= 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 %>

Ez ugyanazt a HTML-t fogja létrehozni, mint amit a form_for használatával kaptunk.

A legnagyobb előnye a form_with-nek, hogy nem kell tovább aggódnunk a form_tag és a form_for közötti döntés miatt. Van egy ügyes segítőnk, amely lehetővé teszi számunkra, hogy bármelyik feladatot elvégezzük, mindössze egy váltással a deklarált űrlap első sorában.

Következtetés

A Rails űrlapsegítők nagyszerűek, és a form_with új kiegészítése valóban egyesíti mind a form_tag, mind a form_for összes előnyét. Mostantól egy olyan eszközzel rendelkezel, amely lehetővé teszi számodra, hogy bármilyen igényed alapján űrlapot készíts. Legyen az egy keresési űrlap vagy egy űrlap az adatok adatbázisba történő tárolására, a Rails form helpers segítségével gondoskodhat róla.

Azt is javasolnám, hogy nézze át a Rails Guides-t, hogy megtanulja a bonyolultabb űrlapok készítését. Elég sok lehetőséged van attól kezdve, hogy egy modell elfogadja a beágyazott attribútumokat, hogy beágyazott attribútumokkal és más űrlap-segítőkkel rendelkezzen, hogy egyéni beviteli mezőket hozzon létre. Nagyon sok minden van, amivel játszhatsz, amikor átnézed ezeket a dokumentumokat, úgyhogy használd ki az előnyeit!

Happy Coding!