新手问题 [已解决]:为什么 ajax 表单不生效?

chairy11 · 2014年12月01日 · 最后由 chairy11 回复于 2014年12月02日 · 3384 次阅读

问题

奇怪,明明设置了 remote:true, 为什么就是不生效呢? view 中

<%= simple_form_for(MonthlyOvertime.new, remote: true) do |f| %>
           。。。
<% end %>

生成的 html 也显示有 data-remote="true"

<form accept-charset="UTF-8" action="/monthly_overtimes/12" class="simple_form edit_monthly_overtime" data-remote="true" id="edit_monthly_overtime_12" method="post" novalidate="novalidate">
   。。。            
</form>

在 controller 中

def create
    @monthly_overtime = MonthlyOvertime.new(monthly_overtime_params)

    respond_to do |format|
      if @monthly_overtime.save
        format.html { redirect_to @monthly_overtime, notice: '创建成功!' }
        format.json { render :show, status: :created, location: @monthly_overtime }
        format.js
      else
        format.html { render :new }
        format.json { render json: @monthly_overtime.errors, status: :unprocessable_entity }
        format.js
      end
    end
  end

对应的 view 文件夹下面也有 create.js.erb

$("#try").html("<%= escape_javascript(render(partial: 'monthlies/monthly_overtimes_item', locals: { monthly_overtime: @monthly_overtime } )) %>")

实在不知道还少什么了。难道还需要写处理 js,比如下面这些?

$(document).ready ->
  $("#new_post").on("ajax:success", (e, data, status, xhr) ->
    $("#new_post").append xhr.responseText
  ).on "ajax:error", (e, xhr, status, error) ->
    $("#new_post").append "<p>ERROR</p>"

但我看rails tutorial说的是会自动查找 create.js.erb,然后没看到有对应的 js 内容啊?

目前的情况是点击可以提交,正常更新,但会刷新页面,而不是 ajax 效果……

提交后会提示我

Missing template monthly_overtimes/show, application/show with {:locale=>[:"zh-CN"], :formats=>[:html], :variants=>[], :handlers=>[:erb, :builder, :raw, :ruby, :coffee, :jbuilder]}

说明它 respond_to 响应的一直就是 html 呗……这应该在哪里设置吗?还是说我直接把 format.html 这句删掉算了?

解决方案

暂时把 respond_to 其它格式删了,而且转到 show 动作去了。左试试右试试,其实也不知道是不是这样的因果,反正暂时能用了。 controller 中

def create
   @monthly_overtime = MonthlyOvertime.new(monthly_overtime_params)

   respond_to do |format|
     if @monthly_overtime.save
       format.js { render action: 'show', status: :created, location: @monthly_overtime }
     else
       format.js { render json: @monthly_overtime.errors, status: :unprocessable_entity}      
     end
   end
 end

view 中不再用默认的 create.js.erb 和 update.js.erb,而是写了一个 show.js.erb

$("#try").html("<%= j(render(partial: 'monthlies/monthly_overtimes_item', locals: { monthly_overtime: @monthly_overtime } )) %>");

谢谢各位:)

#1 楼 @small_fish__ 应该是有的哦, application.js 里面

//= require jquery
//= require jquery_ujs
//= require turbolinks

gemfile 里面

gem 'coffee-rails'
gem 'uglifier'
gem 'jquery-rails'
gem 'jquery-turbolinks'
gem 'turbolinks'
gem 'jbuilder'
gem 'simple_form'
action="/monthly_overtimes/12"

这里的路径不对吧,不应该是/monthly_overtimes 么

#3 楼 @zackteng 哦,我这同一个页面的几个数据,有两种情况,一是要新建的,二是要更新的,我抄错了,对应的是

<form accept-charset="UTF-8" action="/monthly_overtimes" class="simple_form new_monthly_overtime" data-remote="true" id="new_monthly_overtime" method="post" novalidate="novalidate">

#4 楼 @ruby_sky 555,看完还是没有找到解决方案……

带图片了?

#7 楼 @smallX 没呀,纯数字……

还是说我直接把 format.html 这句删掉算了?

删掉就可以了

需要 登录 后方可回复, 如果你还没有账号请 注册新账号