Javascript没有加载最新提交的数据

我最近问过这个问题: Javascript Form Submition ?

现在我想弄清楚为什么在表单提交后, create.js.erb不会加载最新数据(提交的数据)。

如果我再次提交数据,表格将使用倒数第二个数据更新,但不会更新绝对最新数据。

…为什么?

编辑:

最新代码 –

类别控制器:类Admin :: CategoriesController <Admin :: AdminController …

def create @category = Admin::Category.new(params[:admin_category]) # You can't retrieve the @categories before attempting to add new one. Keep at end of create method. @categories = Admin::Category.all respond_to do |format| if @category.save save_to_history("The category \"#{@category.name}\" has been created", current_user.id) format.json { render json: { html: render_to_string(partial: 'categories') } } # I've tried both the above and bellow #format.json { render json: { html: render_to_string('categories') } } format.html { redirect_to(admin_categories_url, :notice => 'Category was successfully created.') } format.xml { render :xml => @category, :status => :created, :location => @category } else format.html { render :action => "new" } format.xml { render :xml => @category.errors, :status => :unprocessable_entity } end end end ... end 

使用Javascript:

  $(function(){ $('#new_admin_category').on('ajax:success', function(event, data, status, xhr){ $("#dashboard_categories").html(data.html); }); });  

解决了

我使用@PinnyM的方法并添加了一个create.json.erb文件,其中包含以下代码:

  { "html":" 'categories', :content_type => 'text/html') %>" } 

并将我的create方法更改为:

 def create @category = Admin::Category.new(params[:admin_category]) respond_to do |format| if @category.save # You can't retrieve the @categories before attempting to add new one. Keep after save. @categories = Admin::Category.all save_to_history("The category \"#{@category.name}\" has been created", current_user.id) format.json format.html { redirect_to(admin_categories_url, :notice => 'Category was successfully created.') } format.xml { render :xml => @category, :status => :created, :location => @category } else format.html { render :action => "new" } format.xml { render :xml => @category.errors, :status => :unprocessable_entity } end end end 

如果这很乱,请提供建议。

您需要处理远程(AJAX)提交的成功回调。 data参数(第二个参数)保存响应:

 $(function(){ $('#new_category').on('ajax:success', function(event, data, status, xhr){ eval(data); }); }); 

一个更好的方法(并避免危险的eval )可能只是返回partial,并让回调决定如何处理它:

 # in create action format.json { render json: { html: render_to_string('categories') } } # in your js, run at page load $(function(){ $('#new_category').on('ajax:success', function(event, data, status, xhr){ $("#dashboard_categories").html(data.html); }); }); 

UPDATE

刚刚注意到@RomanSpiridonov所写的内容 – 他是完全正确的。 在尝试添加新分区之前,您无法检索@categories。 将行@categories = ...移动到create方法的末尾。

另外,我注意到你的Category模型是命名空间的 – 这意味着你的默认表单id属性更像是’new_admin_category’。 您应该检查它实际呈现的方式,并在注册成功回调时在jQuery选择器中使用该ID:

 $(function(){ $('#new_admin_category').on('ajax:success', function(... 

保存新类别之前定义的方法“创建”中的实例变量@categories。 这就是为什么你无法在模板中收到最新类别的原因。 我想你可以这样写:

$("#dashboard_categories").append("<%= escape_javascript(render("category")) %>");

您可以在assets/javascripts文件夹中的文件中添加这段assets/javascripts

 $(your_form_selector).on('ajax:success', function(){ // Read link to see what event names you can use instead of ajax:success and // which arguments this function provides you. }) 

要设置your_form_selector您可以在表单中添加一个id并使用#myFormId

在这里阅读更多