Question

我是rails的新手，在我目前的项目中，我正在使用Twitter上的Bootstrap。 Bootstrap的popover很漂亮，我打算广泛使用它们，所以我想为popover写一个视图助手。

以下是popover的标准html代码：

<div id="modal-from-dom" class="modal hide fade">
  <div class="modal-header">
    <a href="#" class="close">&times;</a>
    /* popover header's code here */
  </div>
  <div class="modal-body">
    /* popover body's code here */
  </div>
  <div class="modal-footer">
    /* popover footer's code here */
  </div>
  <% end %>
</div>
/* button to show the popover */

这是我的助手功能：

def render_popup(before,id ,button ,header, body, footer, after)
result = before.html_safe
result += '<div id="'.html_safe
result += id.html_safe
result += '" class="modal hide fade">'.html_safe
result += '<div class="modal-header">'.html_safe
result += '<a href="#" class="close">&times;</a>'.html_safe
result += header.html_safe
result += '</div>'.html_safe
result += '<div class="modal-body">'.html_safe
result += body.html_safe
result += '</div>'.html_safe
result += '<div class="modal-footer">'.html_safe
result += footer.html_safe
result += '</div>'.html_safe
result += '</div>'.html_safe
result += after.html_safe
result += '<button data-controls-modal="'.html_safe
result += id.html_safe
result += '" data-backdrop="true" data-keyboard="true" class="btn primary">'.html_safe
result += button.html_safe
result += '</button>'.html_safe
return result.html_safe
end

我知道这个功能很难看，但我找不到更好的方法来编写它：/ 也许有一些街区？

最后我在视图中调用此帮助程序的代码

<% before = form_tag url_for(:controller => "refunds" , :action => "create"), :method => :post %>
<% header = '<h3>Remboursement</h3>'%>
<% body = capture do %>
     <p>
         <p style="margin-top:15px"><b>Montant : (€)</b></p>
         <%= text_field_tag :amount, nil, :placeholder => "ex : 123.45", :class => "span3" %>
         <p style="margin-top:15px"><b>Destination</b></p>
         <%= select_tag :user_id, options_for_select(@users_select), :class => "span3" %>
         <p><br /></p>
         <%= hidden_field_tag :current_user_id, @currentUser.id %>
      </p>
<% end %>
<% footer = submit_tag "Rembourser", :class => "btn primary", :id =>"Rembourser" %>
<% after = "</form>" %>

<div style="margin-top:30px;text-align:center">
  <%= render_popup (before,'refund', '+ Rembourser', header, body, footer, after)%>
</div>

正如你所看到的，我有一个在popover上分割的表单。表单的字段位于正文中，提交按钮位于页脚中。弹出窗口显示正确，但提交按钮不起作用（没有帮助程序）。

如何正确编写辅助函数并处理spited表单问题？

更新1

基于nathanvda回答和clyfe评论我已经编辑了我的助手并创建了一个部分。
以下是部分代码：

<%= before %>
<div id="<%= popover_id %>" class="modal hide fade">
  <div class="modal-header">
    <a href="#" class="close">&times;</a>
    <%= header%>
  </div>
  <div class="modal-body">
    <%= body %>
  </div>
  <div class="modal-footer">
    <%= footer %>
  </div>
</div>
<%= after %>
<button data-controls-modal="<%= popover_id %>" data-backdrop="true" data-keyboard="true"   class="btn primary">
    <%= button %>
</button>

和辅助方法：

def render_popup(before,id ,button ,header, body, footer, after)
render :partial => 'shared/popover', 
       :locals => { :popover_id => id, 
                    :header => header.html_safe,
                    :body => body, 
                    :footer => footer.html_safe,
                    :button => button,
                    :before => before, 
                    :after => after.html_safe}
end

视图的代码不会改变它更干净，表单显示正确，但提交按钮不能更好地工作（当我点击它时没有任何事情发生）。安妮的建议？

更新2

通过比较生成的html代码和帮助程序，没有它我发现了提交问题。 form_tag不在正确的位置在视图中使用此代码：

<% header = '<h3>Remboursement</h3>'%>
<% body = capture do %>
  <p>
    <%= form_tag url_for(:controller => "refunds" , :action => "create"), :method => :post %>
    <p style="margin-top:15px"><b>Montant : (€)</b></p>
    <%= text_field_tag :amount, nil, :placeholder => "ex : 123.45", :class => "span3" %>
    <p style="margin-top:15px"><b>Destination</b></p>
    <%= select_tag :user_id, options_for_select(@users_select), :class => "span3" %>
    <p><br /></p>
    <%= hidden_field_tag :current_user_id, @currentUser.id %>
  </p>
<% end %>
<% footer = submit_tag "Rembourser", :class => "btn primary", :id =>"Rembourser" %>
<% after = "</form>" %>

<div style="margin-top:30px;text-align:center">
  <%= render_popup (nil,'refund', '+ Rembourser', header, body, footer, after)%>
</div>

现在我有一个有效的解决方案，但它并不完美。如果我放弃after = "</form>"会很好吗？

Answer 1

创建一个文件夹app/views/shared，在该文件夹中添加一个名为_popover.html.erb的部分，其中包含：

<%= before %>
<div id="<%= popover_id %>" class="modal hide fade">
  <div class="modal-header">
    <a href="#" class="close">&times;</a>
    <%= header%>
  </div>
  <div class="modal-body">
    <%= body %>
  </div>
  <div class="modal-footer">
    <%= footer %>
  </div>
  <% end %>
</div>
<%= after %>
<button data-controls-modal="<%= popover_id %>'" data-backdrop="true" data-keyboard="true" class="btn primary">
  <%= button %>
</button>

然后在你的助手中你可以写下：

def render_popup(before,id ,button ,header, body, footer, after)
  render :partial => 'shared/popover', 
         :locals => {:popover_id => id, :header => header, :body => body, 
                     :footer => footer, :before => before, :after => after}
end

希望这有帮助。

Rails 3：为popovers编写一个视图助手

更新1

更新2

1 个答案: