除了数据之外，还要向button_to添加一个自定义文本字段

Question

我有一个名为"DELETE"的button_to，我在其中添加了

data: { confirm: "Are you sure you want to delete?" }

我还希望添加一个自定义文本字段，在删除之前询问用户适当的原因，然后存储它。除了默认的confirm或disabled选项之外，我可以在数据中添加文本字段吗？

到目前为止，我已经用window.open完成了这项工作，但这只是一个变通方法。

Answer 1

您不能在确认框中添加其他字段。因为它只得到一个参数-消息。请参见此处。

我建议为此任务建立一个自定义的确认对话框。

Answer 2

首先，button_to与data: {confirm....}不同（尽管仔细想想，您可能在button_to上使用data: {...}）

---

如果您使用button_to，您可以使用params选项向表单添加额外的参数：

<%= button_to "Text", your_path, params: {name: "John"} %>

如文档中所述，参数作为隐藏字段传递，因此应该是静态数据（用户不可编辑）：

要在表单中呈现为隐藏字段的参数的哈希。

---

既然你想使用data: {confirm ...}，你必须清楚它是如何工作的：

confirm: 'question?'-这将允许不引人注目的JavaScript驱动程序提示指定的问题（在这种情况下，生成的文本将是问题？）。如果用户接受，链接将正常处理，否则不采取任何操作。

如上所述，这加载了一个"确认"JS对话框，该对话框基本上只有ok/cancel来确定用户是否希望继续。

您不能通过标准确认对话框发送额外参数。

--

可以为Rails创建一个自定义的确认操作。

这涉及到重写$.rails.showConfirmationDialog(link);方法，因此它可以显示您需要的任何内容，而不是调用一个低级别的confirm对话。

要点如下：

#app/assets/javascripts/application.js
$.rails.allowAction = function(link) {
  if (link.data('confirm')) {
    $.rails.showConfirmationDialog(link);
    return false;
  } else {
    return true;
  }
};
$.rails.confirmed = function(link) {
  link.data('confirm', null);
  return link.trigger('click');
};
$.rails.showConfirmationDialog = function(link) {
  var message, title;
  message = link.data('confirm');
  title = link.data('title') || 'Warning';
  return // ->> your custom action <<-- //
};

我们使用以下内容：

#app/assets/javascripts/application.js
var myCustomConfirmBox;
$.rails.allowAction = function(element) {
  var answer, message;
  message = element.data("confirm");
  answer = false;
  if (!message) {
    return true;
  }
  if ($.rails.fire(element, "confirm")) {
    myCustomConfirmBox(element, message, function() {
      var callback, oldAllowAction;
      callback = $.rails.fire(element, "confirm:complete", [answer]);
      if (callback) {
        oldAllowAction = $.rails.allowAction;
        $.rails.allowAction = function() {
          return true;
        };
        element.trigger("click");
        $.rails.allowAction = oldAllowAction;
      }
    });
  }
  return false;
};
myCustomConfirmBox = function(link, message, callback) {
  var flash, icon, wrap;
  if (!($("flash#confirm").length > 0)) {
    icon = document.createElement("i");
    icon.className = "fa fa-question-circle";
    flash = document.createElement("flash");
    flash.setAttribute("id", "confirm");
    flash.appendChild(icon);
    flash.className = "animated fadeInDown";
    flash.innerHTML += message;
    wrap = document.getElementById("wrap");
    wrap.insertBefore(flash, wrap.childNodes[0]);
    return $(document).on("click", "flash#confirm", function() {
      return callback(link);
    });
  }
};

--

如果你想通过这个传递一个额外的参数，你必须在JS中使用它。我以前从未做过，但我知道您可以将它附加到发送到服务器的查询中。

因此，如果您更新代码以显示路由和控制器代码，我应该能够想出如何为您传递参数的想法。