6

我正在尝试通过 AJAX 执行保存操作link_to： 

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

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

现有解决方案存在的问题：

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

onclick：
如果我添加:onclick => "$(this).replaceWith('<span>Saving...</span>');"链接将立即被替换，即使用户取消确认

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

4

5 回答 5

5

您可以使用钩子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!');
  })

注意：请参考下面的评论，这也很重要

于 2013-08-26T15:19:18.110 回答
1

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

于 2013-08-26T15:25:16.887 回答
1

我认为这是您想要的功能超出 Rails 的 JS 助手提供的功能的情况。在这一点上，我将避免使用 :confirm 和 :remote 选项来链接_to，并用普通的 jQuery UJS 或类似的方式实现它。

您可能还会考虑隐藏链接并在用户确认时显示“正在保存...”范围，而不是替换 html；我认为它最终会更简单，并且仍然会给你你正在寻找的效果。

于 2013-08-26T15:16:10.917 回答
0

这是我最终这样做的方式：

<%= 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>'); });" %>

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

于 2013-08-26T17:09:53.147 回答
0

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

于 2016-04-01T14:16:10.377 回答