Rails Ajax Jquery

Question

我正在使用 Rails 对文章进行动态编辑。在每篇文章上都可以添加段落。我想在 railscast 的 136-jquery-ajax-revised 教程之后将 Ajax 与 Jquery 一起使用。我为表单和 new.js.erb 响应创建了模板，但我一直收到同样的错误：

ParagraphsController#new 缺少此请求格式和变体的模板。 request.formats: ["text/html"] request.variant: []

这是从 view/article/show 请求新表单的链接

<%= link_to 'New Paragraph', new_article_paragraph_path(@article), remote: true, class: 'uk-button uk-button-primary' %>

查看/段落/_form

<div class="article-form-container">
  <%= form_with scope: :paragraph, url: article_paragraphs, remote: true do |f| %>
    <%= f.text_field :title, class: 'uk-input', placeholder: 'Title of paragraph (optional, can be a subtitle of the article)' %>
    <%= f.text_area :text, class: 'uk-textarea', placeholder: 'Content of paragraph' %>
    <%= f.hidden_field :position, :value => 3 %>
    <div class="submit-button">
    <%= f.submit class: 'uk-button uk-button-primary' %>
    </div>
  <% end %>
</div>

路线

resources :articles, only: %i[show update destroy create]

resources :articles do
  resources :paragraphs, only: %i[new create update destroy]
end

查看/段落/new.js.erb

$('div#article-control-panel').hide("fast", function () {
    $('div#article-control-panel').after('<%= j render 'form' %>')
})

控制器/段落控制器

class ParagraphsController < ApplicationController
  def new
    @paragraph = Paragraph.new
  end

  def create
    @paragraph = Paragraph.new(paragraph_params)
    @article = Article.find(params[:article_id])

    if @article.user == current_user
      @paragraph.article = @article
      @paragraph.save
    end

    respond_to do |format|
      format.html { redirect_to @article }
      format.js
    end
  end

  def paragraph_params
    params.require(:paragraph).permit(:title, :text, :position)
  end
end

无法弄清楚问题出在哪里。在我按下链接按钮后，错误发生在文章页面。

编辑 奇怪的是，如果我尝试在 article_path 之类的内容中更改 orm 的 url，它将起作用...

Answer 1

您的控制器缺少respond_to。您的新函数应如下所示：

def new
  @paragraph = Paragraph.new
  respond_to { |format| format.js }
end

这个respond_to 允许rails 调用相关的.js.erb 文件，在这个例子中是你的new.js.erb 文件。

请记住，当您想要执行 ajax 调用时，您需要以下几个元素：

• 控制器操作中的respond_to { |format| format.js }

• 您的 js.erb 文件必须与您的控制器操作 (foo.js.erb) 同名

• 通过您的js.erb 文件呈现的部分，通常与您的 js 文件命名相同。 (_foo.js.erb)

• 如果是链接，需要remote: true。如果它是一个表单并且您使用的是 rails 5，您可以使用 form_with 或简单地包含 remote: true。