Rails 5:更新操作不适用于AJAXified表单

时间:2016-11-06 07:24:29

标签: javascript jquery ruby-on-rails ajax

我可以通过下拉菜单查看用户选择的位置,可以编辑特定的用户角色。

/common/roles/index.erb 中我有这个:

<form class="form-horizontal" role="form" method="get" action="/common/roles" data-remote="true">
<div class="col-sm-10"><select class="form-control m-b" name="users" id="user_list">
  <option value="">Please, select user</option>
     <% @users.each do |user| %>
        <% for role in user.roles %>
           <option value="<%= role.id %>"><%= user.name %></option>
        <% end %>
     <% end %>
  </select>
</div>
</form>
<!-- Here we render role edit form -->
<div id = 'selected_role' ></div>
<!-- Role edit form ends -->

这是选择显示用户名的位置,角色ID是选项值。

roles.js 中,我有一个监听器,其中为编辑传递了选择角色ID:

(function($) {
$('#user_list').change(function() {
  var roleId = $( "#user_list" ).val();
  $.ajax({
    url: '/common/roles/' + roleId + '/edit',
    method: 'GET',
  });
});
})(jQuery); /*global jQuery*/

/common/roles/edit.js.erb 如下所示:

$("#selected_role").html("<%=j render 'common/roles/editrole', locals: { role: @role } %>");

并呈现角色编辑部分 /common/roles/_editrole.html.erb

<%= form_for :role, method: :patch, remote: true do |f| %>
<form class="m-t" role="form" action="" id="editrole">
        <div class="form-group">
            <label class="col-sm-2 control-label">General</label>
            <div class="col-sm-10" >
           <%= f.select :general, Role.generals.to_a.map { |w| [w[0].humanize, w[0]] }, {}, {class:"form-control m-b"} %>
            </div>
        </div>
   <%= f.submit "Save changes", class: "btn btn-primary block full-width m-b" %>
  <% end %>
</form>

要完成此表单,我仍然需要在有问题的情况下完成更新操作。 在提交角色编辑表单时,它会启动PATCH,但会显示编辑网址。这是控制台中的错误:

Started PATCH "/common/roles/1/edit"
ActionController::RoutingError (No route matches [PATCH] "/common/roles/1/edit"):

虽然有特定的PATCH路线:

common_role PATCH  /common/roles/:id(.:format)     common/roles#update

/common/roles_controller.rb 中我有:

def update
@role = Role.find(params[:id])
if @role.update_attributes(role_params)
respond_to do |format|
  format.html {
              flash[:success] = "Role updated!"
              redirect_to common_roles_path
  }
  format.js

/common/roles/update.js.erb 中我有这一行:$('.editrole').hide()

我可以在编辑中打开表单并直到更新操作它工作正常。 如何修复更新操作错误?

解决方案更新

在更新操作中,我遗漏了respond_to do |format| + /common/roles/update.js.erb 我不得不改为:

$('.container').empty().append('<%=
  escape_javascript(
    render 'update'
  )
%>')

1 个答案:

答案 0 :(得分:2)

试试这个。

<%= form_for role, url: common_role_path(role), method: :patch, remote: true do |f| %>

role这里指的是渲染部分时传递的局部变量。