在Rails应用程序中使用Jquery发送AJAX Post请求

18

使用简单的控制器:

  def new
    @product = Product.new
    respond_to do |format|
      format.html #new.html.erb
      format.json { render json: @product}
    end
  end

  def create
    @product = Product.new(params[:product])
    respond_to do |format|
      if @product.save
        format.html { redirect_to @product, notice: "Save process completed!" }
        format.json { render json: @product, status: :created, location: @product }
      else
        format.html { 
          flash.now[:notice]="Save proccess coudn't be completed!" 
          render :new 
        }
        format.json { render json: @product.errors, status: :unprocessable_entity}
      end
    end
  end

以及简单的 AJAX 请求

$("h1").click ->
  $.post
    url: "/products/"
    data:
        product:
            name: "Filip"
            description: "whatever"

    dataType: "json"
    success: (data) ->
      alert data.id

我正在尝试发送新产品,但服务器回应:

[2013-07-09 18:44:44] 错误的URI `/products/[object%20Object]'。

而且数据库中没有任何更改。为什么它会得到prducts/[oobject]而不是/products URI?这里出了什么问题?


1
只是一点小提示,自Rails 3以来,respond_to do |format|已经不再必要。您可以在控制器的顶部使用respond_to :html, :xml,然后在操作中使用respond_with @object_name。如果您感兴趣,请参阅此Railscast:http://railscasts.com/episodes/224-controllers-in-rails-3?view=asciicast - Brian Dear
1个回答

34

试试这个:

CoffeeScript

$ ->
  $("h1").click ->
    $.ajax({
      type: "POST",
      url: "/products",
      data: { product: { name: "Filip", description: "whatever" } },
      success:(data) ->
        alert data.id
        return false
      error:(data) ->
        return false
    })

ES6化

$(() => $("h1").click(() => $.ajax({
  type: "POST",
  url: "/products",
  data: { product: { name: "Filip", description: "whatever" } },
  success(data) {
    alert(data.id);
    return false;
  },
  error(data) {
    return false;
  }
})));

为什么你返回false,而且...为什么它改变了任何东西?它能工作,但我仍然不明白为什么。 - Filip Bartuzi
2
可能会有一些好的解释在这里:https://dev59.com/y3RA5IYBdhLWcg3wtwSe - dasnixon
谢谢!我发现它很有用。太棒了! - Filip Bartuzi
我不确定在成功或错误函数中返回false是否有任何作用。通常我会在事件函数的结尾返回false。因此,在这种情况下,就在代码片段的最后返回false。 - Julien
@vipin8169 $.post$.ajax的参数语法不同。 jQuery.post( url [, data ] [, success ] [, dataType ] )在值之前没有键。它很简单,例如$.post( "api/json.php", { name: "John", time: "2pm" } ); - Paul Geisler
看到所有这些CoffeeScript的例子,真是太搞笑了,考虑到它已经几乎死亡了。 - fatfrog

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接