Rails4:提交失败后将浏览器窗口滚动到表单(验证错误)



所以我在页面底部有评论的表单(典型的文章和评论示例)。如果验证失败,则显示验证错误。

这是我的评论控制器代码:

class CommentsController < ApplicationController
  before_action :authenticate_admin!, only: [:destroy]
  expose(:article)
  expose(:comment, attributes: :comment_params)
  expose(:reply) { Reply.new }
  def create
    comment.article = article
    if verify_recaptcha(model: comment, message: t('captcha_verification_error')) && comment.save
      flash[:comment_notice] = t('comment_created_successfully')
      redirect_to article_path(article) + '#comments'
    else
      flash[:comment_errors] = comment.errors.full_messages
      render 'articles/show'
    end
  end
  def destroy
    comment.destroy
    redirect_to article_path(article)
  end
  private
  def comment_params
    params.require(:comment).permit(:author, :content)
  end
end

这是表格:

= simple_form_for(comment, url: article_comments_path(article)) do |f|
  - if flash[:comment_errors]
    .alert.alert-danger
      strong= pluralize(flash[:comment_errors].count, 'error') + ' prohibited this article from being saved:'
      - flash[:comment_errors].each do |msg|
          ul
            li= msg
  fieldset class='form-group'
    = f.label t('author')
    = f.text_field :author, class: 'form-control', placeholder: t('who_are_you')
  fieldset class='form-group'
    = f.label t('content')
    = f.text_area :content, class: 'form-control', rows: 6, placeholder: t('what_do_you_want_to_say')
  fieldset class='form-group'
    = recaptcha_tags
  fieldset class='form-group'
    = f.submit t('create_comment'), class: 'btn btn-primary'

对于表单,我使用简单表单。此外,我正在使用体面的曝光和纤薄的

我想在验证失败后我的页面向下滚动到表单(这样用户就不必手动滚动)。有没有简单的方法可以做到这一点?

AFAIK我不能通过锚来渲染(这将解决问题)。有什么想法吗?

所以我用这个放在注释形式中的javascript解决了这个问题:

javascript:
  if (document.getElementById("comment_errors")) {
    location.hash = '#new_comment';
  }

当id为"comment_errors"(我的验证错误div)的元素存在时,它会跳到它。

相关内容

  • 没有找到相关文章