Rails replace confirm with Zurb foundation modal - Uncaught TypeError: confirmWithReveal is not a function

Question

首先让我说，我不擅长javascript。如果我遗漏了一些明显的东西，请原谅我。

我想用 Foundation 模式对话框替换标准确认对话框。有人可以帮助我在我的页面中构建正确的结构吗？我在 index.html.erb 页面上有以下 link_to：

<%= link_to 'Delete', post, method: :delete, data: { confirm: "Are you sure?" }, class: "tiny radius button" %>

我注意到当页面加载时，控制台出现错误：

Uncaught TypeError: $(...).confirmWithReveal is not a function

这个错误似乎出现在每一页上。我明确定义的模态对话框适用于其他页面。

我进行了一些研究，但找不到任何明确的示例来说明如何进行这项工作。 This page 显示了各种样式的确认，但没有显示如何使其在 <%= link_to ... %> 表达式中工作。

Answer 1

confirm_with_reveal 不是基础的一部分，而是一个额外的模块。以下是我使用它的步骤：

放置来自 the github repo 的源文件之一，例如。 G。 confirm_with_reveal.js 到您的 rails' vendor/assets/javascripts/confirm_with_reveal.js 文件夹中。通常我将 repo 添加为子模块，但这取决于你。

添加到app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require confirm_with_reveal/confirm_with_reveal
$(function(){
  $(document).confirmWithReveal();
});

重写你的标准 rails 从

确认

link_to 'Delete', post, method: :delete, data: { confirm: "Are you sure?" }, class: "tiny radius button" %>

至

link_to 'Delete', post, method: :delete, data: { confirm: {title:"Are you sure?"} }, class: "tiny radius button" %>

并使用您在 README 中找到的属性。

此外，如果你使用foundation 6，你必须修改javascript并在第54行替换：

modal.foundation('reveal', 'close');

和

modal.foundation('close');

第 68 行：

foundation('reveal', 'open')

和

foundation('open')

javascript