Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

devise専用エラーをbootstrap3のエラーと同様に表示する

More than 5 years have passed since last update.

やりたいこと

devise専用のエラー表示(devise_error_messages!)を、
他のalertと同じようにBootstrap3を利用した表示方法に置き換えたい。

devise.jpg

 ▽ ▽ ▽ ▽ ▽ ▽ ▽ ▽ ▽ ▽ ▽ ▽ ▽

bootstrap3.jpg

実装方法

deviseのヘルパーを作って"devise_error_messages!"をオーバーライドした箇所で整形。
あまりスマートではないかもしれませんが、これが一番簡単そうですね…。

app/helpers/devise_helper.rb
module DeviseHelper
  def devise_error_messages!
    return "" if resource.errors.empty?

    html = ""
    messages = resource.errors.full_messages.each do |errmsg|
      html += <<-EOF
      <div class="alert alert-danger alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert">
          <span aria-hidden="true">&times;</span>
          <span class="sr-only">close</span>
        </button>
        #{errmsg}
      </div>
      EOF
    end
    html.html_safe
  end

  def devise_error_messages?
    resource.errors.empty? ? false : true
  end

end
inodev
TechCommitというプログラミング学習者を支援するサービスを運営しています。
http://inodev.hatenablog.com/
tech-commit
TechCommitは仲間と楽しく学び続ける為の、コミュニティ型IT学習環境です。
https://www.tech-commit.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away