Ruby on Rails – Elementos – Form – Linux

Publicado: 5 de fevereiro de 2015 em Ruby on Rails

O Rails torna fácil e simples criar uma interface gráfica de usuário acabando com a complexidade na criação de elementos para seus formulários web, fornecendo ajudantes de visão para gerar a marcação HTML para seus Forms. No entanto, uma vez que esses ajudantes têm diferentes casos de uso, os desenvolvedores precisam conhecer as diferenças entre os métodos de ajuda antes de colocá-los em uso.

O Rails fornece uma série de ajudantes para gerar elementos de formulário, tais como caixas de seleção, campos de texto, botões de rádio e vários outros. Você ainda pode adicionar Widgets externos através de um GEM ou frameworks completos como o Apotomo e vários outros.

Rails Form: http://guides.rubyonrails.org/form_helpers.html

Usando Elementos de Formulários

1 – Crie um projeto Ruby on Rails para o banco de dados MySQL, o configure adequadamente, use os respectivos códigos abaixo para completar os arquivos de modelo, visão e controlador:

Migra modelo – Migrate


rails g model modelo01 nome:string sobrenome:string cargo:string data:datetime salario:float genero:string ativo:boolean observacao:string
rake db:migrate

Rails - Elementos - FORM

Rails – Elementos – FORM

Exemplo:

Neste exemplo criamos um modelo de dados e o utilizamos para gravar dados inseridos pelo usuário em um formulário web.

Ruby on Rails

Model

class Modelo01 < ActiveRecord::Base
  
  # Cria validação
  validates  :nome, :sobrenome, :cargo, :data, :salario, :genero, 
             :presence => true#{:message => "Campo obrigatório"}    
                  

  # Regex - valores alphanumericos
  validates  :nome, :sobrenome, :cargo,
             :format => {:with => /[A-Za-z]+/,
                         :message => "Permitido somente caracteres alphanuméricos"}
end

View

<h1>Desenvolvimento Aberto</h1>
<h2>Ruby on Rails - Elementos - Form </h2>

<%= form_for @modelo, :url => {:action => :create} do  |cad|%>

<% if @modelo.errors.any?  %>
<h3>Erros: </h3>
<ul style="color:red">
	<% @modelo.errors.full_messages.each do |menssagem| %>
	<li>
		<%= menssagem %>
	</li>
	<% end %>
</ul>
<% end %>
<fieldset>
	<legend>
		Cadastro:
	</legend>
	<table>
		<tr>
			<td> <%= cad.label :nome%> </td>
			<td> <%= cad.text_field :nome  %> </td>
		</tr>
		<tr>
			<td><%= cad.label :sobrenome%></td>

			<td><%= cad.text_field :sobrenome, :size => "35x10"%></td>
		</tr>

		<tr>
			<td><%= cad.label :cargo%></td>
			<td><%= cad.select :cargo, options_for_select([["Vocalista", "Vocalista"],
			["Guitarrista", "Guitarrista"] ,
			["Baixista","Baixista"],
			["Baterista","Baterista"] ]),
        html_options= {:style => "width: 100px;"} %></td>
		</tr>

		<tr>
			<td><%= cad.label :data%></td>

			<td><%= cad.date_field :data, :size => "15x10"%></td>
		</tr>

		<tr>
			<td><%= cad.label :salario%></td>
			<td><%= cad.text_field :salario, :size => "10x10"%></td>
		</tr>

		<tr>
			<td><%= cad.label :genero%></td>
			<td><%= cad.collection_radio_buttons :genero, [["Masculino", "Masculino"] ,["Feminino", "Feminino"]] ,
        :first, :last, { item_wrapper_tag: false } %></td>
		</tr>
		<tr>
			<td><%= cad.label :ativo%></td>
			<td><%= cad.check_box :ativo %></td>
		</tr>

		<tr>
			<td><%= cad.label :observacao%></td>
			<td><%= cad.text_area :observacao , :size => "40x10" %></td>
		</tr>

	</table>
</fieldset>
<p>
	<%= cad.submit "Adicionar dados" %>
</p>

<% end %>

Controller

class MeucontroleController < ApplicationController
  # Controladores
  def index
    @modelo  = Modelo01.new
  end

  def new
    @modelo  = Modelo01.new
  end

  # Cria registro
  def create
    @modelo = Modelo01.new(modelo_params)
    if @modelo.save      
      
      flash[:notice] = "Dados Salvos com sucesso."
      render "index"
    else
      # Você pode colocar uma menssagem aqui.
      render "index"
    end
  end

  # Define parametros requeridos
  private

  def modelo_params
    params.require(:modelo01).permit(:nome, :sobrenome, :cargo, :data,
                                     :salario, :genero, :ativo, :observacao)
  end

end

Anúncios

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s