如何使用Rails 4轮询数据库中的一个值,如果值发生变化,则使用AJAX进行刷新



我已经使用Rails好几年了,但这是我第一次尝试使用AJAX和Javascript。我花了大量的时间阅读各种各样的网站,试图弄清楚什么在哪里& &;它应该做什么。

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

路线。

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

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

<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>

story.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); 
});  

stories_controller.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"(我以为我是从数据库中"获取"一个值,但我猜不是)。

我认为POST是我需要获得@story的AJAX函数。转身离开故事桌,却不知道如何让它做任何事。我还需要GET来刷新吗?我已经拼凑了几个星期的代码,这似乎是我现在应该弄清楚的东西。

如果你把它放在公共github repo上,人们可以在上下文中看到你的代码,并发送pull请求来演示他们如何做。

相关内容

  • 没有找到相关文章

最新更新