【问题标题】:Rails simple_form gem is adding a green border to inputs that are pre-populatedRails simple_form gem 正在为预填充的输入添加绿色边框
【发布时间】:2019-01-21 17:31:56
【问题描述】:

我在使用 rails simple_form gem 时遇到问题。我正在使用 bootstrap 4。

我通过将gem 'simple_form' 添加到 Gemfile 来安装 gem。我还通过rails g simple_form:install --bootstrap 运行了生成器。

Simple Form 在我的应用程序中几乎可以完美运行。这是一个使用名为“Store”的模型的示例,该模型具有一个字符串属性:“name”。

<%= simple_form_for @store do |f| %>
  <%= f.input :name %>
  <%= f.button :submit, class: "btn-primary" %>
  <%= link_to "Cancel", stores_url, class: %w[btn btn-danger] %>
<% end %>

我在这段代码中遇到的唯一问题是,当表单用于更新页面时,simple_form 会向输入元素添加一个“.is-valid”类,这会导致引导程序向该字段添加绿色边框.如果没有预先填写该字段,例如将表单用于“新建”操作时,则不会发生这种情况。

谢谢

【问题讨论】:

  • 听起来像预期的行为。问题是什么?

标签: ruby-on-rails ruby bootstrap-4 simple-form


【解决方案1】:

config/initializers/simple_form_bootstrap.rb 中有几个以config.wrapper 开头的不同块。您可以从中删除对valid_class: 'is-valid' 的任何引用,以便它不再包含在您的表单输入中。即……

改变这个

config.wrappers :vertical_form, tag: 'div', class: 'form-group', error_class: 'form-group-invalid', valid_class: 'form-group-valid' do |b|
  ...
  b.use :input, class: 'form-control', error_class: 'is-invalid', valid_class: 'is-valid'
  ...
end

对此(通过删除valid_class

config.wrappers :vertical_form, tag: 'div', class: 'form-group', error_class: 'form-group-invalid' do |b|
  ...
  b.use :input, class: 'form-control', error_class: 'is-invalid'
  ...
end

如果您不希望包含对 error_class 的引用,也可以删除它。

【讨论】:

  • 耶!太棒了。不过,我确实有一个问题。为什么文件顶部有注释说不要直接编辑它?
  • 建议按照他们的guide 创建自定义包装器(通过创建单独的组件文件并将它们包含在初始化程序中)。但是,在您的情况下,您希望全局删除默认类 (is-valid),因此直接编辑初始化程序就可以了。
猜你喜欢
  • 2018-06-25
  • 1970-01-01
  • 1970-01-01
  • 2022-08-05
  • 2014-08-16
  • 1970-01-01
  • 2023-03-12
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多