我开发了一个维护资源的Rails 3程序,即。它创建,更新,列出和删除没有屏幕刷新请求的记录。它使用AJAX请求与服务器通信。每个请求由控制器处理,然后具有用于更新DOM的JavaScript代码的js.erb文件从服务器传输以供浏览器执行。从用户的角度来看,该程序的工作原理如下:
屏幕的顶部包含一个输入表单,用于插入和编辑/更新资源记录。屏幕的底部列出了所有资源记录,其中包含在每条记录行末尾进行编辑和销毁的操作。
所有操作在单独执行时都能正常工作,因为操作(创建,编辑/更新,销毁)发生并且资源列表在屏幕上更新而没有屏幕刷新请求。
问题是在编辑/更新操作集结束时,屏幕上的操作类型在更新模式下“卡住”,我无法再次切换到创建模式。
同样,当我执行销毁操作时,屏幕操作将保持“创建”或“更新” - 具体取决于之前执行的操作。
在编辑/更新和销毁案例中,我想将下一个操作设置为创建模式。
关于如何解决这个问题的任何想法。
我尝试使用JQuery attr()函数来设置下一个操作而没有任何成功。
代码的某些部分如下所示。
Controller code :
class CustomersController < ApplicationController
before_filter :load
def load
@customers = Customer.all
@customer = Customer.new
end
# Display composite form used for AJAX operations.
def index
end
# This method implements customer create action for AJAX request.
def create
@customer = Customer.new(params[:customer])
if @customer.save
flash[:notice] = "Customer Record Created."
@customers = Customer.all
respond_to do |format|
format.js
end
end
end
# This method get customer for editing using AJAX.
def edit
@customer = Customer.find(params[:id])
respond_to do |format|
format.js
end
end
# This method implements customer update from AJAX form.
def update
@customer = Customer.find(params[:id])
if @customer.update_attributes(params[:customer])
flash[:notice] = "Customer Record Updated."
@customers = Customer.all
respond_to do |format|
format.js
end
end
end
# This method implements customer delete from AJAX form.
def destroy
@customer = Customer.find(params[:id])
@customer.destroy
flash[:notice] = "Customer Record Deleted"
@customers = Customer.all
respond_to do |format|
format.js
end
end
# This method lists all customers on file.
def getcustsjson
render :json => @customers
end
# This method lists all the books purchased by a particular customer.
def getbooksjson
@customer = Customer.find(params[:id])
@order = @customer.order
@orderitems = Orderitem.find_all_by_order_id(@order)
@book = Book.find_all_by_id(@orderitems)
render :json => @book
end
end
edit.js.erb file:
editform = "";
editform = editform + '<%= escape_javascript( render('form') ) %>';
alert(" unEscaped editform : " + editform);
$("#customer_form").html(editform);
Update.js.erb file:
<% if @customer.errors.any? -%>
/* Hide the Flash Notice div */
/* Create an Errors List */
/* Update the html of the customer_errors div with the Errors List */
/* Show the customer_errors div */
$("#flash_notice").hide(300);
var errlst = "";
errlst = errlst + "<ul>";
<% @customer.errors.full_messages.each do |msg| %>
errlst = errlst + "<li><%= escape_javascript(msg) %></li>";
<% end %>
errlst = errlst + "</ul>";
alert("Errors List : " + errlst);
$("#customer_errors").html(errlst);
$("#customer_errors").show(300);
<% else -%>
/* Hide the customer_errors div */
/* Update the html of the flash_notice div with the Flash contents */
/* Clear the form */
/* Set form for Create Customer mode */
/* Replace the html of the customers_list div with the updated Customers List */
$("#customer_errors").hide(300);
$("#flash_notice").html("<%= flash[:notice] %>");
$(":input:not(input[type=submit])").val("");
$(":submit").attr("value", "Create Customer");
$("form").attr({id:"new_customer", action:"/customers"});
$("#customers_list").html("<%= escape_javascript render('customers') %>");
<% end %>
Index.html file:
<div id="customer_form"><%= render 'form' %></div>
<div id="customers_list"><%= render 'customers' %></div>
_form.html partial :
<%= form_for(@customer, :remote => true ) do |f| %>
<div id="customer_errors" style="display:none"></div>
<div class="field">
<%= f.label :firstname %>
<%= f.text_field :firstname %>
<%= f.label :lastname %>
<%= f.text_field :lastname %>
</div>
<div class="field">
<%= f.label :email %>
<%= f.text_field :email %>
<%= f.label :phone %>
<%= f.text_field :phone %>
</div>
<div class="field">
<%= f.label :password %>
<%= f.text_field :password %>
<%= f.label :address_id %>
<%= f.text_field :address_id %>
</div>
<div id="next_action", class="actions">
<%= f.submit %>
</div>
<% end %>
_customers.html partial :
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
<th>Phone</th>
<th>Password</th>
<th>Address</th>
<th></th>
<th></th>
<th></th>
</tr>
<% @customers.each do |customer| %>
<tr>
<td><%= customer.firstname %></td>
<td><%= customer.lastname %></td>
<td><%= customer.email %></td>
<td><%= customer.phone %></td>
<td><%= customer.password %></td>
<td><%= customer.address_id %></td>
<td><%= link_to 'Edit', edit_customer_path(customer), :remote => true %></td>
<td><%= link_to 'Destroy', customer, :remote => true, :confirm => 'Are you sure?', :method => :delete %></td>
</tr>
<% end %>
</table>
编辑:在JQuery中使用attr()函数解决了问题 - 请参阅上面的update.js.erb代码。最后一部分是使用“:submit”元素将提交按钮值重置为Create Customer。谢谢大家。