Question

我有一个名为'DELETE'的button_to我已添加

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

我还希望在删除之前添加一个自定义文本字段，询问用户是否有适当的理由，然后将其存储起来。我可以在默认的confirm或disabled选项中添加文本字段吗？

到目前为止，我已经使用window.open完成了它，但它只是一种解决方法。

Answer 1

您无法在确认框中添加其他字段。因为它只获得单个参数 - 消息。请参阅here。

我建议为此任务构建自定义确认对话框。

Answer 2

首先，button_to与data: {confirm....}不同（虽然考虑过它，但您可能在data: {...}上使用button_to

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

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

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

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

由于您希望使用data: {confirm ...}，因此必须明确其工作原理：

confirm: 'question?' - 这将允许不显眼的JavaScript驱动程序提示指定的问题（在这种情况下，生成的文本会有问题吗？如果用户接受，则链接得到正常处理，否则无法执行操作服用。

如上所述，这会加载"confirm" JS dialogue，基本上只有ok/cancel来确定用户是否希望继续。

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

-

您可以做的是创建自定义确认action for Rails。

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

这是gist：

#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中使用它。我以前从未这样做过，但我知道您可以将它附加到您发送到服务器的查询中。

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

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

2 个答案: