JavaScript无法加载最新提交的数据 [英] Javascript not loading latest submitted data

问题描述

我最近问了一个问题: JavaScript表单提交?

I recently asked this question: Javascript Form Submition?

现在，我正在尝试弄清为什么在提交表单后， create.js.erb 没有不会加载最新数据(已提交的数据).

Now I'm trying to work out why, after form submission, the create.js.erb doesn't load the latest data (the data which was submitted).

如果我再次提交数据，表将更新为倒数第二个数据，而不是绝对最新的数据.

If I submit the data again, the table will update with the second last data but not the absolute latest.

...为什么?

最新代码-

类别控制器: 类别Admin :: CategoriesController<管理员:: AdminController ...

Categories controller: class 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:

Javascript:

<script type='text/javascript'>
  $(function(){
    $('#new_admin_category').on('ajax:success', function(event, data, status, xhr){
      $("#dashboard_categories").html(data.html);
    });
  });
</script>

已解决

我使用@PinnyM的方法，并使用以下代码添加了create.json.erb文件:

I used @PinnyM's method and added a create.json.erb file with the following code:

<% self.formats = ["html"] %>
{
  "html":"<%= raw escape_javascript( render :partial => 'categories', :content_type => 'text/html') %>"
}

并将我的创建方法更改为:

and changed my create method to:

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

如果这很麻烦，请提供建议.

Please do offer suggestions if this is messy.

推荐答案

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

You need to handle the success callback for your remote (AJAX) submission. The data parameter (2nd argument) holds the response:

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

一种更好的方法(避免危险的eval)可能是只返回部分代码，并让回调函数决定如何处理它:

A better way to do this (and avoid the dangerous eval) might be to just return the partial, and have the callback decide what to do with it:

# 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);
  });
});

更新

只是注意到@RomanSpiridonov写的是什么-他是绝对正确的.尝试添加新类别之前，您无法检索@categories.将行@categories = ...移到create方法的末尾.

Just noticed what @RomanSpiridonov wrote - he's absolutely correct. You can't retrieve the @categories before attempting to add your new one. Move the line @categories = ... to the end of the create method.

此外，我注意到您的Category模型是命名空间的-这意味着您的默认表单id属性更有可能类似于'new_admin_category'之类的东西.注册成功回调时，您应该检查它的实际呈现方式，并在jQuery选择器中使用该ID:

Also, I noticed that your Category model is namespaced - that means your default form id attribute is more likely something like 'new_admin_category'. You should check how it is actually being rendered and use that id in your jQuery selector when registering the success callback:

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

这篇关于JavaScript无法加载最新提交的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！