ruby - 如何在 ruby​​ on rails 中使用 Ajax？

Question

在ROR看了好几篇关于Ajax的文章，对于如何使用Ajax还是一头雾水!

我的项目中有一个main/index.html和一个main_controller。我要实现如下描述的功能:

单击 index.html 中的链接后，RSS 内容将显示在索引中。我已经通过跳转到另一个网页来完成功能。但是我不知道如何使用 Ajax...

索引

 <h1>Listing Jobs</h1>
<table>
    <tr>
        <th>Source</th>
        <th></th>
    </tr>
<% @jobs.each do |job| %>
    <tr>
        <td><%= job.source %></td>
        <td>
            <%= link_to 'Show', #:controller=>'main', :action=>'show',
                :id=>job.id,:remote=>true, "data-type"=>:json, :class=>'updateJob'%>
        </td>
    </tr>
<% end %>
</table> 

<script type="text/javascript" charset="utf-8">

$(function(){
#   $('#'+job.id).bind("click",function(){
#       $('#showJob').append('Hi')
#   })

$('#'+job.id).bind("ajax:success",function(data, status, xhr){
    ("<h1>hello</h1>").appendTo("#showJob") 
})

})
</script>

show.html

<div id="showJob">
    </div>
<table>
    <tr>
        <th>Source</th>
        <th>Link</th>
    </tr>
<% @feed.items.each do |item| %>
    <tr>
        <th><%= item.title %></th>
        <th><%= item.link  %></th>
    </tr>
<% end %>

</table> 

主 Controller

require 'rss'
require 'rss/1.0'
require 'rss/2.0'
require 'open-uri'

class MainController < ApplicationController
    #get /jobs
    def index
        @jobs=Job.all

        respond_to do |format|
            format.html # index.html.erb
            format.json {render:json=>@jobs}
        end
    end

    def welcome
        @num_sources =Job.count
    end

    def show
        job=Job.find(params[:id])
        url=job.url
        open(url) do |rss|
            @feed = RSS::Parser.parse(rss)
        end

        respond_to do |format|
        # format.html do
        #   render :partial=>'main/show'
        # end
        format.json {render :json=>@feed}
        end
    end

end

Answer 1

不是绑定(bind)到 click 事件，而是为您要处理的 ajax 事件添加绑定(bind)。通常，这将包括 ajax:success 事件:

$(function(){
    $('#'+job.id).on("ajax:success", function(data, status, xhr){
        // do something with 'data' json object
    });
});

可以找到完整的事件列表here .

要让 Controller 在呈现时使用“json”格式，请将您的链接更改为如下所示:

<%= link_to 'Show', { :controller=>'main', :action=>'show', :id=>job.id }, 
                    :data => {:remote=>true, :type=>:json}, :class=>'updateJob'%>

请注意，构成 url (controller, action, id) 的哈希值需要在与其他属性分开的哈希值中传递才能正常工作。如果您将工作设置为 routes.rb 文件中的资源，您可以使这更简单:

<%= link_to 'Show', job, :data => {:remote=>true, :type=>:json}, :class=>'updateJob'%>