放置Rails Form_For字段在不同位置

Question

我有一个要填写表格的模型，由标题和正文组成。或者，我希望能够提交链接以及此模型的一部分。如果填写，则提交，否则忽略。例如，表单将在页面顶部具有标题和正文字段。

<%= form_for(@micropost, remote: true) do |f| %>
  <div class="field">
    <%= f.text_field :title %>
    <%= f.text_area :content %>
  </div>
  <%= f.submit "Post" %>
<% end %>

现在，我想为链接添加字段，但在页面上的不同位置（以表明它是可选的）。

    <%= f.text_field :link %>

我试着在一个部分做这一切，

<%= form_for(@micropost, remote: true) do |f| %>
  <div class="field">
    <%= f.text_field :title %>
    <%= f.text_area :content %>
    <! insert other content here >
    <%= f.text_field :link %>
  </div>
  <%= f.submit "Post" %>
<% end %>

但这会导致部分嵌套非常混乱，我不确定如何让它正常工作。或者，我想知道是否有可能在页面顶部有一个 form_for，在页面底部有另一个 form_for 以某种方式“同步”，这样通过按下顶部的提交按钮，输入的值底部的 form_for 也被收集和提交。

<%= form_for(@micropost, remote: true) do |f| %>
  <div class="field">
    <%= f.text_field :title %>
    <%= f.text_area :content %>
  </div>
  <%= f.submit "Post" %>
<% end %>

<%= form_for(@micropost, remote: true) do |f| %>
   <! somehow sync this with the other form >
   <%= f.text_field :link %>
<% end %>

Answer 1

一种选择是为link 属性提供一个辅助文本字段。将其值复制到映射link 属性的隐藏变量

假设你要使用 jQuery，

<%= form_for(@micropost, remote: true) do |f| %>
  <%= f.hidden_field :link %>
  <div class="field">
    <%= f.text_field :title %>
    <%= f.text_area :content %>
  </div>
  <%= f.submit "Post" %>
<% end %>

在同一页面上的某个地方

<%= text_field_tag 'micropost[link]', '', id: 'aux_link' %>

<script>
  $(function(){
    $('form').on('submit', function(){
      $('#micropost_link').val($('aux_link'));
    });
  });
<script>

这只是一种方法。根据您的表单元素 ID 调整代码。

这种方法的一个问题是很难验证link 属性是否是强制性的。

Answer 2

只需将form_for 设为视图的根

您可以像使用容器div 一样使用form_for。
然后将<input> 和<button> 放在您想要的位置，就像制作您的普通网页一样。

然后，因为你想让一些输入可选，你可以在 rails 控制器中做到这一点。

def create_or_update
  params[:micropost].delete(:link) if params[:micropost][:link].blank?
  # continue the task
end

这个技巧对密码等所有可选字段都很有用

Answer 3

我发现here 这样做的规范方法是使用“form”属性。为表单提供一个 id，字段可以从该 id 引用回表单，即使该字段位于表单之外。例如，

<%= form_for(@micropost, remote: true, html: { id: "micropost_form" }) do |f| %>
   <div class="field">
      <%= f.text_field :title %>
      <%= f.text_area :content %>
   </div>
   <%= f.submit "Post" %>
<% end %> 

然后我们可以使用fields_for 将所需字段放置在其他位置，链接回原始表单。

<%= fields_for @micropost do |f| %>
  <%= f.text_field :link, form:"micropost_form" %>
<% end %>