Question

我正在使用Unobtrusive JavaScript solution for polling in a Rails application，这似乎是一个很好的解决方案，但我无法从.stop()视图调用.js.erb方法。我希望能够在通过轮询刷新其中一个项目的内联编辑表单时停止轮询。我从edit.js.erb视图中调用.stop()，但它保持轮询...

unobtrusive_poller.coffee：

class Poller

  constructor: (@div) ->

  interval: ->
    $(@div).data("interval") ? 3000

  url: ->
    $(@div).data("url")

  start: ->
    console.log "Starting polling"
    @intervalId = setInterval(@request, @interval())

  request: =>
    # console.log "Interval: #{@interval()}"
    # console.log "URL: #{@url()}"
    console.log "Polling"
    $.ajax(
      url: @url(),
      dataType: "script").fail (data) =>
      console.log "Poll failed!" # + JSON.stringify(data)
      return

  stop: ->
    console.log "Stopping polling"
    clearInterval(@intervalId)

$(document).on 'turbolinks:load', ->
  $("div[data-poll='true']").each (i, div) ->
    console.log "DIV: " + div
    new Poller(div).start()

edit.js.erb：

// Pause polling while edit form is open
console.log($('div#messages[data-poll='true']'));
new Poller($('div#messages[data-poll='true']')).stop();

// $("div[data-poll='true']").each(function(i, div) {
//   console.log("DIV: " + div);
//   return new Poller(div).stop();
// });

...

据我了解，问题是@intervalId未定义。

这是在正确的轨道上吗？

非常感谢任何有关如何完成这项工作的建议。

谢谢！

Answer 1

您需要存储正在初始化轮询事件的每个div的对象。您每次都在创建新对象，但不能将其存储在任何位置。你需要它将它存储在某个地方，以便稍后可以在创建的对象上调用stop。

更新：将Id存储在哈希
中

此代码创建一个hashmap来存储您绑定的所有poll事件

window.pollHash = {}

$(document).on 'turbolinks:load', ->
  $("div[data-poll='true']").each (i, div) ->
    console.log "DIV: " + div
    id = $(div).attr("id")
    pollObject = new Poller(div)
    pollObject.start()
    window.pollHash[id] = pollObject

在edit.js.erb中，您再次使用new运算符创建新对象。您应该如上所述使用已存储的对象，然后调用stop方法，如下所示。

targetDiv = $('div#messages[data-poll='true']')
//Not sure about your target condition, replace 
// above selector as your target as per your need.
targetId = $(targetDiv).attr("id")
window.pollHash[targetId].stop()

希望它有所帮助！

从不同的文件调用JavaScript构造函数方法--Rails

1 个答案: