twitter bootstrap - deeply nested content_tag, concat and rails 3 -
i'm frustrated using rails 3.2 , making helper bootstrap modals. don't understand when need concat versus when don't end tags missing , end hash options between before , ending tags. when use concat on content-tag do-end hell breaks loose. want replicate html:
<div id="stupid_modal" class="modal hide fade" tabindex="-1" data-width="760"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fontello-icon-cancel-1"></i></button> <h4>modal header</h4> </div> <div class="modal-body"> <div class="page-header"> <p>test header 1 2 3.</p> </div> <div class="row-fluid"> content here... blah blah </div> </div> <div class="modal-footer"> <button type="button" data-dismiss="modal" class="btn">close</button> <button type="button" class="btn btn-green">save changes</button> </div> </div> i cannot life of me button in h4 in modal header work out right. neither can page header appear in modal body.
my helper looks this:
module modalhelper def modal(css_id, header_text, hidden = true, options = {},&block) class_text = "modal" class_text += " hide fade" if hidden content_tag(:div, :class => 'modal hide fade', :id => css_id, :style => ("display:none;" if hidden)) concat modal_header(header_text) concat modal_body(&block) concat modal_footer end end def modal_button(link_text, href) modal_caller link_text, href, :button end def modal_link(link_text, href) modal_caller link_text, href end private def modal_caller(link_text, href, type = nil) options = { :"data-toggle" => "modal" } options.merge!({ :class => "btn" }) if type == :button link_to link_text, "#" + href, options end def modal_header(header_text) content_tag(:div, :class => 'modal-header') concat content_tag(:button,(content_tag(:i, :class => 'fontello-icon-cancel-1')),:class => 'close', :"data-dismiss" => 'modal', :"aria-hidden" => 'true') concat content_tag(:h4, header_text) end end def modal_body(page_header = "") content_tag(:div, :class => 'modal-body') content_tag(:div, :class => 'page-header') concat content_tag(:p, page_header) end content_tag(:div, :class => 'row-fluid') yield end end end def modal_footer content_tag(:div, :class => 'modal-footer') concat content_tag(:button, 'close', type: "button", :class => 'btn btn-boo', :"data-dismiss" => 'modal') concat content_tag(:button, 'save', type: "button", class: 'btn btn-green') end end end
and link looks this:
<%= modal_link "new stupid modal", "stupid_modal" %> and modal html looks this:
<%= modal('stupid_modal', 'shouldnt work?', submit: true, tabindex: '-1') %> <% render 'stupid_modal_partials/stupid_modal' %> <% end %> the output this:
<button aria-hidden="true" class="close" data-dismiss="modal"><i>{:class=>"fontello-icon-cancel-1"}</i></button> which looks in page source:
<i>{:class=>"fontello-icon-cancel-1"}</i> update:
changing modal_header works:
def modal_header(header_text) content_tag(:div, :class => 'modal-header') concat content_tag(:button,(content_tag(:i, "",:class => 'fontello-icon-cancel-1')),:class => 'close', :"data-dismiss" => 'modal', :"aria-hidden" => 'true') concat content_tag(:h4, header_text) end end but doesn't:
def modal_header(header_text) content_tag(:div, :class => 'modal-header') concat content_tag(:button,:class => 'close', :"data-dismiss" => 'modal', :"aria-hidden" => 'true') concat content_tag(:i, "",:class => 'fontello-icon-cancel-1') end concat content_tag(:h4, header_text) end end which begs question, wzup concat? , missing -- tried empty quotes second argument button content_tag
you don't need ever use concat.
each rails helper returns string html in it:
tag(:br) # "<br>" so simplest helper method this:
# "<br>" def br tag(:br) end if have multiple strings of html sum them up:
# "<button>close</button><button>save</button>" def modal_buttons content_tag(:button, "close") + content_tag(:button, "save") end note can't call them don't modify view
# "<button>save</button>" def modal_buttons content_tag(:button, "close") # won't content_tag(:button, "save") end for blocks same rules apply:
# "<div><button>close</button><button>save</button></div>" def modal_footer content_tag(:div) # block returns inside div content_tag(:button, "close") + content_tag(:button, "save") end end def modal_body content_tag(:div) modal_header + yield + modal_footer end end as side note, using rails helpers construct whole view isn't intended purpose. supposed help in dynamic places, static html better done in erb templates.
Comments
Post a Comment