Блок Content_tag, вложенный в блок content_tag - Form Builder
Я пытаюсь создать rails FormBuilder для стилизации формы с использованием стиля начальной загрузки:
<div class="form-group has-error">
<label for="exampleInputEmail1">Email address</label>
<div class="input-group>
<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email">
<span class="input-group-addon glyphicon glyphicon-user"></span>
</div>
<p class="help-block>can't be blank</p>
</div>
Я смог заставить работать конструктор форм, когда у меня был только один тег div (исключая группу ввода для традиционной формы начальной загрузки. Моя проблема в том, что я не могу получить вложенный тег content_tag с помощью div с классом "input-group") "работать должным образом. Я пытался добавить элементы и оборачивать тег content_tag в записи, но безрезультатно.
class LargeFormBuilder < ActionView::Helpers::FormBuilder
include ActionView::Helpers::TagHelper
include ActionView::Helpers::CaptureHelper
include ActionView::Helpers::TextHelper
attr_accessor :output_buffer
%w(text_field text_area email_field password_field).each do |form_method|
define_method(form_method) do |*args|
attribute = args[0]
options = args[1] || {}
options[:label] ||= attribute
options[:class] ||= "form-control input-lg"
label_text ||= options.delete(:label).to_s.titleize
content_tag(:div, class: "form-group #{'has-error' if !object.errors[attribute].empty?}") do
concat label(attribute, label_text, class: "control-label")
concat (
content_tag(:div, class: "input-group") do
concat super(attribute, options)
concat content_tag(:span, "", class: "input-group-addon glyphicon glyphicon-user")
end
)
concat errors_for_field(attribute)
end
end
end
def errors_for_field(attribute, options={})
return "" if object.errors[attribute].empty?
content_tag(:p, object.errors[attribute].to_sentence.capitalize, class: "help-block")
end
end
2 ответа
Это гораздо проще, что на самом деле вам не нужно использовать concat
Вы можете просто использовать +
чтобы добиться того же результата более ясным способом, просто убедитесь, что первая строка html_safe
content_tag(:div, class: "form-group #{'has-error' if !object.errors[attribute].empty?}") do
label(attribute, label_text, class: "control-label").html_safe + \
content_tag(:div, class: "input-group") do
concat super(attribute, options)
concat content_tag(:span, "", class: "input-group-addon glyphicon glyphicon-user")
end + \
errors_for_field(attribute)
end
и для еще большей читабельности
content_tag(:div, class: "form-group #{'has-error' if !object.errors[attribute].empty?}") do
label_html = label(attribute, label_text, class: "control-label")
input_html = content_tag(:div, class: "input-group") do
concat super(attribute, options)
concat content_tag(:span, "", class: "input-group-addon glyphicon glyphicon-user")
end
error_html = errors_for_field(attribute)
label_html.html_safe + input_html + error_html
end
Я думаю, что это хороший пример вложенного content_tag с тремя слоями и начальной загрузкой. это вспомогательный метод формы, который выполняет действие ex.:new или:edit и выводит доступные локали, используя стиль кнопки пагинации при начальной загрузке 4.
def form_lang_switcher(action)
content_tag(:nav, :"aria-label" => 'language switch') do
content_tag(:ul, class: 'pagination pagination-sm justify-content-end') do
I18n.available_locales.each do |loc|
concat content_tag(:li, (link_to loc.upcase,
url_for(action: :"#{action}", locale: loc),
class: "page-link"),
class: "page-item #{(I18n.locale == loc ? "active" : "")}").html_safe
end
end
end
end