Den første gang jeg blev introduceret til Ruby on Rails var jeg ret imponeret. Det var den første programmeringsramme, som jeg lærte, og jeg må sige, at jeg blev lidt forelsket. Jeg havde lige lært at bygge applikationer ved hjælp af Sinatra og syntes, det var et ret fantastisk værktøj, men så så jeg, hvad Rails kunne gøre…
En af de vigtigste funktioner i Rails, som jeg virkelig nød at bruge, var From Helpers. Det gjorde det muligt for mig at undgå at skrive al HTML for at opbygge en formular, og det gav mig til gengæld mulighed for at lave mere komplekse funktioner. I denne artikel vil jeg gennemgå de forskellige formularhjælpere, der findes i Rails, og endda berøre en ny, der blev lanceret i Rails 5.1-udgaven.
At oprette formularer med HTML kan til tider være en plage, især når de er ekstra lange med alt for mange inputfelter. De kan blive endnu mere besværlige, når du har brug for, at formularen skal sende data til et bestemt api-endpoint eller være forbundet med en databasemodel. Her er en html-formular til at oprette en bruger:
<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>
Som du kan se, kan det hurtigt blive komplekst at skrive alt dette ud. Hvis du kigger nærmere på formularen, kan du se, at vi videregiver en action- og metodeattribut til vores formular for at oprette en ny bruger. Dette er fint og alt sammen, men Rails er super kræsen, når det kommer til at indsende formularer. Denne særlige formular ville ikke klare skæringen, når den blev indsendt. Her kommer Form helpers til undsætning.
Form Helpers
Da jeg først lærte at bruge Form helpers, kunne jeg ærligt talt ikke tro, hvad de gjorde. Som du så fra den tidligere formular, som vi lavede, tager det noget tid og kompleksitet at opnå. Men med form helpers kan dette opnås med meget mindre arbejde og med en hel del “magi”.
Der er tre forskellige helpers, der hjælper os med at bygge hurtige og nyttige formularer i Rails, form_tag, form_for og form_with. Den sidste, form_with, blev introduceret i forbindelse med udgivelsen af Rails 5.1 og kombinerer i det væsentlige de to førstnævnte hjælpere.
form_tag
Den form_tag er den mest grundlæggende af hjælpere og gør til gengæld mindre “magi” for dig. Den vil stadig opbygge formularen for dig, men du skal være mere eksplicit, når du deklarerer url-stier, og den bruges primært, når formularen ikke er knyttet til en Controller#action. Lad os bruge en grundlæggende søgeformular som eksempel:
<%= form_tag("/search", method: "get") do %>
<%= label_tag(:q, "Search for:") %>
<%= text_field_tag(:q) %>
<%= submit_tag("Search") %>
<% end %>
Dette vil generere følgende 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>
Som du kan se, erklærer vi den rute, som vi ønsker, at formularparametrene skal overføres i form_tag. Du kan se, at dette finder sted i linjen <%= form_tag("/search", method: "get") do %>, og du kan også se, at vi angiver http-anmodningen. Dette er stadig ret fantastisk, og du kan se, at Rails tager sig af meget for os selv i den grundlæggende form-hjælper, men Rails har en mere kraftfuld version af dette …
form_for
Form_for er den ægte vare. Denne hjælper giver os mulighed for at binde en formular til et objekt, hvilket giver os mulighed for at oprette/redigere et objekt. Som vi så i form_tag eksemplet, var vi nødt til at være eksplicitte med hensyn til hvilken url-sti der skulle bruges til at indsende formularparametrene, men form_for giver os mulighed for at abstrahere dette. Her er et eksempel:
<%= form_for @user do |f| %> <%= f.label :name %>
<%= f.text_field :name %>
<%= f.label :password %>
<%= f.password_field :password %>
<%= f.submit %><% end %>
Dette vil give den samme kode, som vi så i vores første eksempel på en html-formular.
<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>
Du kan straks se, hvor meget renere denne kode ser ud ved at bruge form_for. Ærligt talt er det lidt tankevækkende at så lidt kode kan skabe al den html, men det gør den virkelig! Du kan se i den første linje i form_for, at vi videregiver en instansvariabel for brugeren, som vil knytte denne formular til dette objekt. Den anden fede ting ved at overgive denne variabel er, at Rails vil lede efter den passende url-sti på sin on, sammenlignet med , hvor vi var nødt til eksplicit at fortælle den, hvor dataene skulle sendes hen.
form_with
- Måske tale om form_with og om dens brug
- Brug kodestumper til eksempel
Hvis du kigger på Ruby on Rails 5.1 Release Notes, er der en note om, at form_for og form_tag forenes til form_with. Denne største fordel med denne nye hjælper er form_with kan generere formulartags baseret på URL’er, scopes eller modeller
Lad os tjekke det ud!
form_with ved hjælp af URL’er
Lad os bruge det samme eksempel, som vi brugte i form_for, og anvende det med form_with ved hjælp af blot en 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 %>
Som du kan se, ligner det meget form_tag, hvor vi angiver en specifik URL (user_path)
form_with using models
Det rigtig smarte ved form_with er, at det også kan bruges til at overdrage modelobjekter, i lighed med 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 %>
Dette vil skabe den samme HTML, som blev produceret ved at bruge form_for.
Vores største fordel ved form_with er, at vi ikke længere behøver at bekymre os om at vælge mellem form_tag og form_for. Vi har en smart hjælper, der giver os mulighed for at udføre begge opgaver med blot et skifte i den første linje i den deklarerede formular.
Slutning
Rails formularhjælpere er fantastiske, og den nye tilføjelse af form_with samler virkelig alle fordelene ved både form_tag og form_for. Du har nu et værktøj, der giver dig mulighed for at bygge en formular baseret på hvad end du har brug for. Uanset om det er en søgeformular eller en formular til at persistere data til din database, kan du få det klaret med Rails form helpers.
Jeg vil også foreslå, at du gennemgår Rails Guides for at lære om at lave mere komplekse formularer. Du har en hel del muligheder fra at tillade en model at acceptere nested attributter, have nested attributter og andre formularhjælpere til at oprette brugerdefinerede inputfelter. Der er så meget at lege med, når man gennemgår disse dokumenter, så udnyt det!
Happy Coding!