使用link_to和简单的AJAX请求从实例返回列

时间:2016-02-27 00:22:38

标签: jquery ruby-on-rails ruby ajax ruby-on-rails-4

我正在尝试添加一个“显示说明”的链接,点击该链接会将description实例的Article列附加到视图中的.article__description--res元素。

我已经看过/阅读了一些关于此的指南,但找不到类似于我正在尝试做的事情。一切都使用表格/路线成员/部分等。

我如何做这个简单的AJAX请求?

# assets/javascripts/articles.js
$(function() {
  return $(".article__description--req").on("ajax:success", function(e, data, status, xhr) {
    $('.article__description--res').append("<%= article.description %>"); # also tried <%= j article.description %>
  });
});

# views/articles/_article.html.erb
<div class="article__description">
  <%= link_to "Show description", article_path(article), remote: true, class: "article__description--req" %>
  <p class="article__description--res">
  </p>
</div>

阅读this之后,我尝试这样做,但它没有用。

# routes.rb
resources :articles do
  member do
    get "description", to: "articles#description"
  end
end

# articles_controller.rb
def description
  respond_to do |format|
    format.js
  end
end

# assets/javascripts/articles.js
$("a.article__description--req").click(function(e) {
  e.preventDefault();
  $.ajax({url: "/articles/description", type: "GET", dataType: "script"});
}

# views/articles/_article.html.erb
<div class="article__info">
  <%= link_to "Show description", description_article_path(article), remote: true, class: "article__description--req" %>
  <p class="article__description--res">
  </p>
</div>

# views/articles/description.js.erb
$('.article__description--res').html('<%= escape_javascript(article.description) %>');

1 个答案:

答案 0 :(得分:0)

我正在做一些假设。您正在查看所有文章的列表,请说文章标题。单击标题时,将显示文章说明。

我不确定具体细节,但我想向大家展示我是如何做这样的事情的。

# articles_controller.rb
def index
  @articles = Article.all
  respond_to do |format|
    format.html
    format.json { render json: @articles }
  end
end

# assets/javascripts/articles.js
$('#article-container').on('click', 'a', function(e) {
  e.preventDefault();
  $.get('/articles').success(function(data) {
    var parsed_data = // parse `data` here
    $('.article__description--res').html(parsed_data);
  })
}

我想你会想要根据所选的文章id来解析数据。此外,可能出现的另一个问题是确定并显示正确的文章描述。我不确定这些细节,老实说,一旦你得到你想要的json数据,我就会搞砸它,并确定如何解析它并显示它。