如何让text_field作为html文本输入工作

Question

期望的工作状态，是知道如何使用与gem一起使用的正确参数创建text_field，这已被证实。

问题是emoji_picker gem在输入字段中效果不佳。

下面提供了一个代码示例：

这是我的旧输入。它可以提交并发送消息：

  <div class="input-box">
    <input type="text" class="input-box_text" id="message_input"/>
  </div>

但后来我想在输入中使用emoji_picker，但仍然使用回车键提交：

class="emoji-picker-container">
  <%= text_field nil, class: 'input-box_text', data: { emojiable: true }, id: 'message_input' %>
</p>

新输入不会提交。我知道问题在于id / class和nil语句。

Answer 1

请参考此处：

http://apidock.com/rails/ActionView/Helpers/FormHelper/text_field

您需要指定型号名称和属性名称。从文档来看，这就是你应该做的。

text_field(:post, :title, size: 20)
# => <input type="text" id="post_title" name="post[title]" size="20" value="#{@post.title}" />

重要的不是id，而是name属性。例如，如果您的description模型中有Message，则应该有类似的内容。

<%= text_field :message, :description, class: 'input-box_text', data: { emojiable: true }, id: 'message_input' %>

然后Rails会将你的表格解析成这样的参数：

{
  message: {
    description: '...'
  }
}

然后您可以像这样使用它：params[:message][:description]

以下是一些其他文档，可帮助您了解其工作原理。

• Rails使用URI:: decode_www_form解码您的HTML表单。请参阅here

• 以下是Rails参数如何工作的rebuilt simplified version。

• 这里是html表单编码标准的参考。

  https://www.w3.org/TR/html5/forms.html#url-encoded-form-data

Answer 2

您需要的是

<input class="input-box_text" data-emojiable="true" id="message_input" name="message[input]" type="text">