1

我已经使用 Rails 工作了几年,但这是我第一次尝试 AJAX 和 Javascript。我花了很多时间阅读各种网站,试图弄清楚什么去哪里以及它应该做什么。

我试图让 Rails 4 应用程序中的 edit.html.erb 中的 'refreshme' div 每次“故事”表中的“转”字段发生变化时刷新。所以我在story.js 中写了一个setInterval() 函数来检查@story.turn 和刷新。我可以让它每 10 秒刷新一次,但我只希望代码每 10 秒检查一次 story.turn 的值,并且只有在值发生变化时才刷新。

routes.rb (对吗?)

match '/stories/:id/refresh' => "stories#refresh", :as => :story_refresh, via: 'post'

refresh.html.erb(在视图/故事中 - 我不知道这里属于什么)

<div class="pollme" data-story-id="<%=@story.id %>" data-story-turn="<%=@story.turn %>" > 
  <%=@story.turn %> // This gets changed based on what other users are editing
</div>

edit.html.erb (views/stories) - show.html.erb 很好地刷新到这个 div

<div class="refreshme" data-story-id="<%=@story.id %>" data-story-turn="<%=@story.turn %>" >
  <%= render 'shared/micropost_form' %>
</div>

故事.js

$(document).on("page:change", function() {
  var $turn;
  $turn = $('.refreshme').data('story-turn'); 

  refreshStories = function(){

    $.ajax({     
        type: "POST",
        data: {  },  // I'm sure something important goes here to get @story.turn out of the stories table
        url: "/stories/"+$('.refreshme').data('story-id')+"/refresh"    
    }).done(function(result) {
            alert('done' );
        $turn = ; // Not sure what data{} can return
    })

    if ($('.refreshme').data('story-turn') != $turn) {
      $.ajax({
        type: "GET", // helps show.html.erb get refreshed into refreshme div in edit.html.erb
        url: "/stories/"+$('.refreshme').data('story-id') 
      }).done(function(result) {
        var $sentence_requests = $('.refreshme');
        if ($sentence_requests.length > 0) {
            $sentence_requests.html(result);
            alert('UPDATED micropost requests ') ;
        } else {
        }
      })
    }
  };
  setInterval(refreshStories, 10000); 
});  

故事控制器.rb

def refresh
  @story = Story.find(params[:id])
  respond_to do |format|
    format.json { }  
    format.html { }
  end  
end

def edit
  @story = Story.find(params[:id])
  @micropost  = @story.microposts.build
  respond_to do |format|
    format.json { } 
    format.html { }
  end  
end

在 story.js 中,GET 函数执行,但 POST 函数不执行。我不确定我应该“发布”什么(我以为我正在从数据库中“获取”一个值,但我想不是)。

我认为 POST 是我需要从 stories 表中获取 @story.turn 的 AJAX 函数,但不知道如何让它做任何事情。我还需要 GET 来刷新吗?我已经把这段代码混了好几个星期了,这似乎是我现在应该弄清楚的事情。任何帮助将不胜感激。

4

1 回答 1

0

如果你把它放在一个公共的 github repo 上,人们可以在上下文中看到你的代码,还可以发送一个拉取请求来展示他们是如何做到的。

于 2014-05-21T15:37:10.477 回答