Action View Form Helpers -2

Ror lab. season 2- the 14th round -

January 12th, 2013

Hyoseong Choi

Special Select

• time_zone_select: time_zone_options_for_select

• country_select : isolated to country_select plugin

• select_date : barebones helper

• date_select : model object helper

Time Zones

time_zone_select

<%= f.time_zone_select :time_zone, [ ActiveSupport::TimeZone['Seoul'], ActiveSupport::TimeZone['Tokyo'],ActiveSupport::TimeZone['Beijing'] ], :default => "Seoul" %>

priority_zones

attribute

model select

time_zone_options_for_select

<%= form_tag do %> <%= select_tag :time_zone, time_zone_options_for_select(nil, [ ActiveSupport::TimeZone['Seoul'], ActiveSupport::TimeZone['Tokyo'], ActiveSupport::TimeZone['Beijing'] ] ), :default => "Seoul" %><% end %>

priority_zones

attributeselected

bare-bones select

country_select• gem ‘country_select’

<%= form_for(@person) do |f| %> <div class="field"> <%= f.label :country %><br /> <%= f.country_select :country, ["Korea, Republic of"] %> </div>

<div class="actions"> <%= f.submit %> </div><% end %>

https://github.com/rails/country_select/blob/master/lib/country_select.rb

priority_countries

select_date

<%= select_date Date.today, :prefix => :start_date %>

<select id="start_date_year" name="start_date[year]"> ... </select><select id="start_date_month" name="start_date[month]"> ... </select><select id="start_date_day" name="start_date[day]"> ... </select>

Date.civil(params[:start_date][:year].to_i, params[:start_date][:month].to_i, params[:start_date][:day].to_i)

Individual Selects• select_year

• select_month

• select_day

• select_hour

• select_minute

• select_second

:prefix defaults to “date”

cf. select_date

date_select

<%= date_select :person, :birth_date %>

<select id="person_birth_date_1i" name="person[birth_date(1i)]"> ... </select><select id="person_birth_date_2i" name="person[birth_date(2i)]"> ... </select><select id="person_birth_date_3i" name="person[birth_date(3i)]"> ... </select>

{:person => {'birth_date(1i)' => '2008', 'birth_date(2i)' => '11', 'birth_date(3i)' => '22'}}

Uploading Files

<%= form_tag({:action => :upload}, :multipart => true) do %>  <%= file_field_tag 'picture' %><% end %> <%= form_for @person  <%= f.file_field :picture %><% end %>

Since Rails 3.1, it automatically sets the multipart/form-data with file_field in the form_for

do |f| %>, :multipart => true

params[:picture]

params[:person][:picture]

What gets uploaded

def upload  uploaded_io = params[:person][:picture]  File.open(Rails.root.join('public', 'uploads', uploaded_io.original_filename), 'w') do |file|    file.write(uploaded_io.read)  endend

an instance of a subclass of IO

uploaded_io

• original_filename• content_type : MIME type

wb

UploadedFile

"uploaded_file"=>#<ActionDispatch::Http::UploadedFile:0x007fd288c8fed0 @original_filename="korean_flag.png", @content_type="image/png", @headers="Content-Disposition: form-data; name=\"person[uploaded]\"; filename=\"korean_flag.png\"\r\nContent-Type: image/png\r\n", @tempfile= #<File:/var/folders/rv/q26ztr693k5_58wbggd_jl300000gn/T/RackMultipart20130107-90570-18x3nfy>>

CLASS ActionDispatch::Http::UploadedFile

Upload Gems

• System Requirement : ImageMagick

• CarrierWave,

• more flexiable than Paperclip

• Rmagick gem, required!

• Paperclip

Ajaxing Upload

• “remotipart” gem: AJAX style file uploads with jQuery

https://github.com/leppert/remotipart

Customizing Form Builders

<%= form_for @person do |f| %>  <%= text_field_with_label f, :first_name %><% end %>

<%= form_for @person, :builder => LabellingFormBuilder do |f| %>  <%= f.text_field :first_name %><% end %>

class LabellingFormBuilder < ActionView::Helpers::FormBuilder  def text_field(attribute, options={})    label(attribute) + super  endend

or

using helper

method

using subclassing

Pro

app/form_builders/labelling_form_builder.rb

Simple_form

• https://github.com/plataformatec/simple_form

• with Twitter Boostrap

• with Foundation 3

Params Naming

Form for model obj

“@person”

submit

Client Server

params[:person]

Basic StructuresArrays & Hashes

<input id="person_name" name="person[name]"

type="text" value="Henry"/>

params hash{‘person’ => {‘name’ => ‘Henry’}}

params[:person]{‘name’ => ‘Henry’}

params[:person][:name]‘Henry’

Nested Hashes

<input id="person_address_city"

name="person[address][city]"

type="text" value="New York"/>

params hash{'person' => {'address' => {'city' => 'New York'}}}

Duplicated Params

<input name="person[phone_number][]" type="text"/>

<input name="person[phone_number][]" type="text"/>

<input name="person[phone_number][]" type="text"/>

params[:person][:phone_number][ ’02-333-1234’, ‘031-323-9898’, ‘062-546-2323’]

array

array

Mixed Params

<input name="addresses[][line1]" type="text"/>

<input name="addresses[][line2]" type="text"/>

<input name="addresses[][city]" type="text"/>

params[:addresses][ { ‘line1’ => ’02-333-1234’, ‘line2’ => ‘031-323-9898’, ‘city’ => ‘seoul’ }]

hash nth-nested but array only one-level

hash & array

hash

array

Using Form Helpers

<%= form_for @person do |person_form| %>  <%= person_form.text_field :name %>  <% @person.addresses.each do |address| %>    <%= person_form.fields_for address, :index => address do |address_form|%>      <%= address_form.text_field :city %>    <% end %>  <% end %><% end %>

<form accept-charset="UTF-8" action="/people/1" class="edit_person" id="edit_person_1" method="post">  <input id="person_name" name="person[name]" size="30" type="text" />  <input id="person_address_23_city" name="person[address][23][city]" size="30" type="text" />  <input id="person_address_45_city" name="person[address][45][city]" size="30" type="text" /></form>

address.id

Using Form Helpers

{ 'person' => { 'name' => 'Bob', 'address' => { '23' => {'city' => 'Paris'}, '45' => {'city' => 'London'} } }}

params

Using :index<%= fields_for 'person[address][primary]', address, :index => address do |address_form| %>  <%= address_form.text_field :city %><% end %>

<%= fields_for 'person[address][primary][]', address do |address_form| %>  <%= address_form.text_field :city %><% end %>

<input id="person_address_primary_1_city" name="person[address][primary][1][city]" type="text" value="bologna" />

or

Form to External Resources - 1

<%= form_tag 'http://farfar.away/form', :authenticity_token => 'external_token') do %>  Form contents<% end %>

<%= form_tag 'http://farfar.away/form', :authenticity_token => false) do %>  Form contents<% end %>

false

payment gateway

form_tag

Form to External Resources - 2

<%= form_for @invoice, :url => external_url, :authenticity_token => 'external_token' do |f|  Form contents<% end %>

<%= form_for @invoice, :url => external_url, :authenticity_token => false do |f|  Form contents<% end %>

form_for

form_for

form_for

Complex forms

• Complex Forms Part 1 - Episode #73

• Complex Forms Part II - Episode #74

• Complex Forms Part III - Episode #75

• Nested Model Form (revised) - Episode #196

Railscasts by Ryan Bates

ROR Lab. screencasts

ROR Lab.

감사합니다.����������� ������������������