利用simple_form ajax提交 不刷新显示model校验错误

gistfile1.md

基于simple_form是因为simple_form对表单错误信息展示提供了很好的方案，当然如果只用 form_for通过列表展示错误信息也可以。

需求

弹窗口提交表单，但不希望刷新页面，即可把Rails model的validation的错误信息展示出来。

开发

Model

 class User < ActiveRecord::Base
   validates :name, presence: true
 end

Controller

 class UsersController < ApplicationController
   def create
    @user = User.new(user_params)

    respond_to do |format|
      if @user.save
        format.html
        format.js 
      else
        format.html { render :new }
        format.js # 关键这一点
      end
    end
   end
 end

View

User form partial

在app/views/users/_form.html.erb :

<div id="user-modal-form">
  <%= simple_form_for(user, remote: true, html: {class: "form-horizontal"}) do |f| %>
    <%= f.input :name %>
    <%= f.submit class: "btn btn-primary" %>
  <% end %>
</div>

创建对应的js响应代码

在 app/views/users/ 创建 create.js.erb: 注意：这段js代码仅仅是为了创建失败时处理方案

$("#user-modal-form").html("<%= escape_javascript(render 'users/form', user: @user) %>");

总结

搞定！

其实原理就是：在服务端做了validate后，重新渲染一个form html，然后通过js 替换前端的form表单即可。