jquery – AJAX表单(使用simple_form)保存错误验证

前端之家收集整理的这篇文章主要介绍了jquery – AJAX表单(使用simple_form)保存错误验证前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这可能是我提出的更困难的问题之一,但是我已经停留了几天,我认为最好从更有经验的铁路社区获得支持

我在工作的一个虚拟应用程序,遵循这个指南大概… ajax/jquery tutorial

该指南帮助我创建了一个“品牌”(包括嵌套模型“模型”,“子模型”和“风格”)提交表单(使用simple_form)和品牌列在同一页面上。 ,并且验证(对于我的模型)是强制的..但是,当我把表单和品牌列表在同一页面上,我失去了在提交失败时出现的整齐的内联验证错误(见下图)。无法获得内联错误的工作使我意识到我有更多的了解渲染..这就是为什么我固定在找到这个问题的答案

…这里是列表:

下面是索引操作的控制器:

def index

    #This is for the product listing

    @brands = Brand.all.reverse 

    #This is for the form   

    @brand = Brand.new
    @model = Model.new
    @submodel = Submodel.new
    @style = Style.new

    respond_to do |format|
      format.html
    end
  end

上述表单创建了嵌套提交表单中使用的品牌,模型,子模型和样式…以下是表单的代码

<%= simple_form_for @brand,:html => { :class => 'form-horizontal' },:remote => true do |m| %>

  <fieldset style = "margin-top:34px;">
    <legend></legend>
    <%= m.input :name,:label => 'Brand' %>         
    <%= m.simple_fields_for :models,@model do |p| %>    
      <%= p.input :name,:label => 'Model' %>
      <%= p.simple_fields_for :submodels,@submodel do |s| %>
        <%= s.input :name,:label => 'Submodel' %>
        <%= s.simple_fields_for :styles,@style do |ss| %>
          <%= ss.input :name,:label => 'Style' %>
        <% end %>
      <% end %>
    <% end %>

    <div class="form-actions">
      <%= m.submit nil,:class => 'btn btn-primary' %>
      <%= link_to 'Cancel',brands_path,:class => 'btn' %>
    </div>
  </fieldset>
<% end %>

现在你可以看到我在使用:remote =>真的…我希望表单创建新的“品牌”,或者为表单重新加载内联验证错误。目前我的创作动作看起来像:

def create
    @brand = Brand.new(params[:brand])

    respond_to do |format|
      if @brand.save
        format.html { redirect_to brands_url,notice: 'Brand was successfully created.' }
        format.json { render json: @brand,status: :created,location: @brand }
        format.js
      else
        format.html { render action: "index" }
        format.json { render json: @brand.errors,status: :unprocessable_entity }
        format.js { render 'reload' }
      end
    end
  end

if @ brand.save下的代码似乎正常工作,但是下面的代码“else”不符合我的要求。那么当@brand不保存时会发生什么?我相信索引操作中的代码正在运行,然后@ brand.errors被转换为json(我假定是为simple_form验证错误),然后reload.js.erb正在运行。

为了重新加载表单(带有验证错误),我已经把行$(“#entryform”)。load(location.href“#entryform> *”,“”);进入reload.js.erb …当我将无效数据放入我的表单reload.js.erb被调用时,但是发生的一切就是表单域重新加载空白,而不是输入数据和内联验证错误

我希望我在这里提供了足够的信息来获得帮助..真的很挣扎在这一个。谢谢!

解决方法

我想你可以通过将表单放在一个局部(我们称之为simple_form)来简化,并将这段代码放在reload.js.erb中:
$("#entryform").html("<%= escape_javascript(render :partial => 'simple_form') %>");

我不熟悉jQuery的加载方法,但我认为它是第二个请求。渲染错误的关键在于您正在使用的实例变量(@brand),而渲染窗体必须与您尝试保存在创建中的表单相同,因此您可以检查其中的错误。这就是为什么当你想渲染错误时,你总是使用render而不是redirect_to。如果你做一个重定向,你开始一个新的请求,意味着@brand被重新初始化。我假设你的$(…)。load(…)有同样的问题。

原文链接:https://www.f2er.com/jquery/182438.html

猜你在找的jQuery相关文章