ギークなエンジニアを目指す男

基幹系SIerがWeb系とかネイティブ系の知識を蓄えようとするブログ

MENU

ドットインストールで作るブログアプリその5(RubyonRails)

例のごとくドットインストールのRails5の動画を元に学んでいきます!
本日は17章からの部分です。

前回記事はこちら taxa-program.hatenablog.com

バリデーションを設定する

現在はデータがNULL(空データ)でも登録できてしまいます。
これではシステム上よくないため、チェックを行います。

バリデーションのチェックはmodelに対して行うため、
下記ファイルを次のように修正します。
rails_lessons/myblog/app/models/post.rb

class Post < ApplicationRecord
  # 必須チェック(presence)と文字数(length)チェック及びエラーメッセージの設定
  validates :title, presence: true, length:{ minimum: 3, message: 'Too short to post!!' }
  validates :body, presence: true
end

エラーが発生した場合は、new画面にエラーメッセージを表示したいため、ビューファイルの修正も行います。

viewファイルの修正(new)

下記の様に修正します。
rails_lessons/myblog/app/views/posts/new.html.erb

<h2>Add New Post</h2>
<%= form_for :post, url: posts_path do |f| %>
<!-- タイトルcolumnに対応するフィールド -->
<p>
    <%= f.text_field :title, placeholder: 'enter title' %>
    <!-- エラーがあるかチェック -->
    <% if @post.errors.messages[:title].any? %>
    <!-- エラーがあった場合、そのメッセージの内容を表示する。メッセージは最初の一つを表示する。 -->
    <span class="error"><%= @post.errors.message[:title][0] %></span>
    <% end %>
</p>
<!-- ボディcolumnに対応するフィールド -->
<p>
    <%= f.text_area :body, placeholder: 'enter body text' %>
    <!-- エラーがあるかチェック -->
    <% if @post.errors.messages[:body].any? %>
    <!-- エラーがあった場合、そのメッセージの内容を表示する。メッセージは最初の一つを表示する。 -->
    <span class="error"><%= @post.errors.message[:body][0] %></span>
    <% end %>
</p>
<p>
    <%= f.submit %>
</p>
<% end %>

あと、errorクラスのスタイルの設定も行います。
rails_lessons/myblog/app/assets/stylesheets/application.css

.error {
  font-size: 12px;
  font-weight: bold;
  color: tomato;
}

最後に、viewで@post変数を使用したので、modelにも宣言する必要があります。
rails_lessons/myblog/app/controllers/posts_controller.rb

def new
  @post = Post.new
end

ここで実行してみます。   f:id:taxa_program:20171125232532p:plain

たしかにエラーメッセージが表示されました。

次回は記事の編集フォームの作成に入ろうと思います。