Rails 4:点击提交按钮后 div 渲染部分
Rails 4: Render partial in div after submit button click
我不明白。我正在构建一个 rails 应用程序并想执行一些单页操作。我现在得到的是,当我从 customers/index.html.erb 的列表中选择一个 'customer' 时,我在 'current_customer' div 中渲染它。当我点击编辑时,表单呈现在 'current_customer' - 完美。但是当我点击表格上的 sumbit 时,我得到一个错误(我理解)'ActionController::UnknownFormat',因为控制器对 'show' 的操作。我被路由到“http://localhost:3000/customers/2”
我想要的是在 clikcing sumit 之后路由到'http://localhost:3000/customers' 并在 'current_customer' div.[=20= 中渲染 cutomers/_show.html.erb ]
我的代码:
customers/index.html.erb
<h1>Listing Customers</h1>
<table>
<thead>
<tr>
<th>Name</th>
<th colspan="3">Actions</th>
</tr>
</thead>
<tbody>
<% @customers.each do |customer| %>
<tr>
<td><%= customer.name %></td>
<td><%= link_to 'Show', customer, remote: true %></td>
<td><%= link_to 'Edit', edit_customer_path(customer), remote: true %></td>
<td><%= link_to 'Destroy', customer, method: :delete, data: { confirm: 'Are you sure?' } %></td>
</tr>
<% end %>
</tbody>
</table>
<br>
<div id="current_customer"></div>
<br>
<%= link_to 'New Customer', new_customer_path, class: "button", id: "new_customer" %>
customers/_show.html.erb
<p>
<strong>Name:</strong>
<%= @customer.name %>
<%= @customer.id %>
</p>
<%= link_to 'Edit Customer', edit_customer_path(@customer) %> |
customers/_edit.html.erb
<h1>Editing Customer</h1>
<%= render 'form' %>
<%= link_to 'Show', @customer %> |
customers/_form.html.erb
<%= form_for(@customer) do |f| %>
<% if @customer.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(@customer.errors.count, "error") %> prohibited this customer from being saved:</h2>
<ul>
<% @customer.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="field">
<%= f.label :name %><br>
<%= f.text_field :name %>
</div>
<div class="actions">
<%= f.submit id: "customer_button", remote: true %>
</div>
<% end %>
customers/edit.js.erb
$("#current_customer").html("<%= escape_javascript(render partial: 'customers/edit', locals: { customer: @customer } ) %>");
customers_controller.rb(部分)
def show
respond_to do |format|
format.js {render layout: false}
end
end
# GET /customers/new
def new
end
# GET /customers/1/edit
def edit
respond_to do |format|
format.js {render layout: false}
end
end
def update
respond_to do |format|
if @customer.update(customer_params)
format.html { redirect_to @customer, notice: 'Customer was successfully updated.' }
format.json { render :show, status: :ok, location: @customer }
else
format.html { render :edit }
format.json { render json: @customer.errors, status: :unprocessable_entity }
end
end
end
我很乐意提供帮助!
谢谢
您需要将 remote: true
放在 form_for
标签中而不是 submit
按钮,请在此处添加
<%= form_for @customer, remote: true do |f| %>
将其从
中删除
<%= f.submit id: "customer_button" %>
此外,update
操作也应该接受 AJAX 请求,创建 update.js.erb
模板并在您使用 [=12= 提交表单时处理 AJAX 请求]
希望对您有所帮助!
按原样提交表单将调用 POST /customer/1
。您需要在您的控制器和路由中定义一个更新方法,并在您的表单中添加 method: :patch
以实现 PATCH /customer/1
.
此外,您可能想定义一个 update.js.erb
并在表单中添加 remote: true
以添加一些动态 AJAX.
你可以用这个替换你的节目link:
<%= link_to "show", {:action => :show}, :remote => true %>
或
<%= link_to "show", customer_path(customer), :remote => true %>
我不明白。我正在构建一个 rails 应用程序并想执行一些单页操作。我现在得到的是,当我从 customers/index.html.erb 的列表中选择一个 'customer' 时,我在 'current_customer' div 中渲染它。当我点击编辑时,表单呈现在 'current_customer' - 完美。但是当我点击表格上的 sumbit 时,我得到一个错误(我理解)'ActionController::UnknownFormat',因为控制器对 'show' 的操作。我被路由到“http://localhost:3000/customers/2” 我想要的是在 clikcing sumit 之后路由到'http://localhost:3000/customers' 并在 'current_customer' div.[=20= 中渲染 cutomers/_show.html.erb ]
我的代码: customers/index.html.erb
<h1>Listing Customers</h1>
<table>
<thead>
<tr>
<th>Name</th>
<th colspan="3">Actions</th>
</tr>
</thead>
<tbody>
<% @customers.each do |customer| %>
<tr>
<td><%= customer.name %></td>
<td><%= link_to 'Show', customer, remote: true %></td>
<td><%= link_to 'Edit', edit_customer_path(customer), remote: true %></td>
<td><%= link_to 'Destroy', customer, method: :delete, data: { confirm: 'Are you sure?' } %></td>
</tr>
<% end %>
</tbody>
</table>
<br>
<div id="current_customer"></div>
<br>
<%= link_to 'New Customer', new_customer_path, class: "button", id: "new_customer" %>
customers/_show.html.erb
<p>
<strong>Name:</strong>
<%= @customer.name %>
<%= @customer.id %>
</p>
<%= link_to 'Edit Customer', edit_customer_path(@customer) %> |
customers/_edit.html.erb
<h1>Editing Customer</h1>
<%= render 'form' %>
<%= link_to 'Show', @customer %> |
customers/_form.html.erb
<%= form_for(@customer) do |f| %>
<% if @customer.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(@customer.errors.count, "error") %> prohibited this customer from being saved:</h2>
<ul>
<% @customer.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="field">
<%= f.label :name %><br>
<%= f.text_field :name %>
</div>
<div class="actions">
<%= f.submit id: "customer_button", remote: true %>
</div>
<% end %>
customers/edit.js.erb
$("#current_customer").html("<%= escape_javascript(render partial: 'customers/edit', locals: { customer: @customer } ) %>");
customers_controller.rb(部分)
def show
respond_to do |format|
format.js {render layout: false}
end
end
# GET /customers/new
def new
end
# GET /customers/1/edit
def edit
respond_to do |format|
format.js {render layout: false}
end
end
def update
respond_to do |format|
if @customer.update(customer_params)
format.html { redirect_to @customer, notice: 'Customer was successfully updated.' }
format.json { render :show, status: :ok, location: @customer }
else
format.html { render :edit }
format.json { render json: @customer.errors, status: :unprocessable_entity }
end
end
end
我很乐意提供帮助! 谢谢
您需要将 remote: true
放在 form_for
标签中而不是 submit
按钮,请在此处添加
<%= form_for @customer, remote: true do |f| %>
将其从
中删除<%= f.submit id: "customer_button" %>
此外,update
操作也应该接受 AJAX 请求,创建 update.js.erb
模板并在您使用 [=12= 提交表单时处理 AJAX 请求]
希望对您有所帮助!
按原样提交表单将调用 POST /customer/1
。您需要在您的控制器和路由中定义一个更新方法,并在您的表单中添加 method: :patch
以实现 PATCH /customer/1
.
此外,您可能想定义一个 update.js.erb
并在表单中添加 remote: true
以添加一些动态 AJAX.
你可以用这个替换你的节目link:
<%= link_to "show", {:action => :show}, :remote => true %>
或
<%= link_to "show", customer_path(customer), :remote => true %>