Question

我正在尝试使用link_to：

通过AJAX执行保存操作

<%= link_to 'Save', image_path(image), method: :patch, 
        data:{ confirm: 'Save image?', remote: true } %>

我希望在确认时将链接替换为Saving...，但无法找到一种干净的方法。

现有解决方案的问题：

disable_with：
如果我添加:disable_with => 'Saving...'，将替换链接的内部HTML而不是链接本身。不要那样。

的onclick：
如果我添加:onclick => "$(this).replaceWith('Saving...');"，即使用户取消确认

，链接也会立即被替换

是否有适合Rails 3 UJS最佳实践的解决方案？

Answer 1

您可以使用挂钩ajax:beforeSend：

$('a#my_link_to').bind('ajax:beforeSend', function(evt, xhr, settings) {
  $(this).replaceWith('<span>Saving...</span>');
})

然后你可以添加绑定到ajax:success：

$('a#my_link_to')
  .bind('ajax:beforeSend', function(evt, xhr, settings) {
    $(this).replaceWith('<span id="saving">Saving...</span>');
  })
  .bind('ajax:success', function(evt, data, status, xhr) {
    $('span#saving').replaceWith('Saved!');
  })

注意：请参考以下评论，这也是非常重要的

Answer 2

我认为这是一个案例，你想要的功能超出了Rails的JS助手所提供的功能。在这一点上，我只是避免使用：confirm和：remote选项来link_to，并在普通的jQuery UJS或类似的实现它。

您可能还会考虑隐藏链接并在用户确认时显示“正在...”范围，而不是替换html;我认为它会以这种方式变得更简单，并且仍然可以为您提供所需的效果。

Answer 3

我认为你应该使用确认：完成事件。（详情：https://github.com/rails/jquery-ujs/blob/master/src/rails.js）

Answer 4

以下是我最终如何做到这一点：

<%= link_to 'Save', image_path(image), method: :patch, 
        data:{ confirm: 'Save image?', remote: true }, 
        onclick: "$(this).one('ajax:beforeSend', 
            function(e) { $(this).replaceWith('<span>Saving...</span>'); });" %>

（此解决方案的问题在于，如果用户点击，不确认，再次点击等处理程序会累积...因此它不理想......）

Answer 5

您可以使用confirm:complete事件。它获取了传递的第二个布尔参数，它告诉结果是取消还是确定。

Rails link_to：确认后做一些事情

5 个答案: