如何在 Rails 的 SimpleForm 中实现 MediumEditor gem？

Question

我想为 rails 添加 MediumEditor to a simple form field where users are able to write texts. There is a gem，但我不知道如何在简单的表单中实现它。f.input 字段应该是什么样子？

Answer 1

根据 MediumEditor 文档，这是如何使用它的：

You can now instantiate a new MediumEditor object:
<script>var editor = new MediumEditor('.editable');</script>
The above code will transform all the elements with the .editable class into HTML5 editable contents and add the medium editor toolbar to them.

您需要通过 id 或 class 来引用输入元素。如果您使用 form_for，它生成的输入元素的 id 将遵循格式 "OBJECT_ATTRIBUTE"，其中 OBJECT 是您正在为其构建表单的对象的名称，并且ATTRIBUTE为表单域对应的属性名

因此，如果您的表单如下所示：

<%= form_for @article do |f| %>
  <%= f.text_area :body, size: "60x12" %>

生成的 html 元素将如下所示：

  <textarea id="article_body" name="article[body]" cols="60" rows="12"></textarea>

因此您必须将 id "article_body" 传递给 MediumEditor 构造函数，如下所示：

 <script>var editor = new MediumEditor('#article_body');</script>

您还可以为输入元素选择任意 id 或 class，将其作为选项传递给表单构建器：

<%= f.text_area :body, size: "60x12", id: "my-medium-editor-text-area" %>

编辑： 我刚刚注意到您使用的是简单表单。如果您想使用简单的形式传递自定义 id，它看起来像这样：

  <%= f.input :article, input_html: { id: "my-medium-editor-text-area" } %>

如何在 Rails 的 SimpleForm 中实现 MediumEditor gem？

How to implement MediumEditor gem within SimpleForm in Rails?

ruby

ruby-on-rails

simple-form

medium-editor