想要在表單旁邊添加嵌套表單

Question

我有用於添加圖像的嵌套表單，並且工作正常。

當我添加新的圖片時，它會在之前的圖片下添加新圖片。

但我想添加新的窗體旁邊的形式。

下nested_form_for

<div class="col-xs-4"> 
          <%= f.fields_for :images do |image_form| %> 
           <%= image_form.collection_select :version_name, Image::VERSION_NAMES.keys.collect{|version_name| [version_name, version_name]}, :first, :last, :include_blank => "Please Select" %> <br /><br /> 
           <div class="image-upload"> 
            <label for="file-input"> 
            <i class="fa fa-cloud-upload"></i> 
            </label> 
            <%= image_form.file_field :picture,:'data-role'=>"none" ,:onchange=>"readURL(this);" ,:id=>"file-input" %> 
           </div> 
           <%= image_tag image_form.object.picture.url,:class=>"img_prev", :style => "width:80px;height: 70px" %><br /> 
           <%= image_form.link_to_remove "Remove this Pic" %><br /> 
          <% end %> 
         </div> 
         <br /><br /><%= f.link_to_add "Add a picture", :images ,:id=>"add_pic"%> 
         </div> 

您可以在圖像看到它的到來下面的預覽圖像，但我想這在前一張照片旁邊。

如果有人有Idea幫助我。 謝謝。

Answer 1

我做了這個函數使用這段代碼工作。

這對我來說

<%= f.fields_for :images do |image_form| %> 
          <div class="col-xs-6"> 
           <%= image_form.collection_select :version_name, Image::VERSION_NAMES.keys.collect{|version_name| [version_name, version_name]}, :first, :last, :include_blank => "Please Select" %> <br /><br /> 
           <div class="image-upload"> 
            <label for="file-input"> 
            <i class="fa fa-cloud-upload"></i> 
            </label> 
            <%= image_form.file_field :picture,:'data-role'=>"none" ,:onchange=>"readURL(this);" ,:id=>"file-input" %> 
           </div> 
           <%= image_tag image_form.object.picture.url,:class=>"img_prev", :style => "width:80px;height: 70px; display:none;" %><br /> 
           <%= image_form.link_to_remove "Remove this Pic" %><br /> 
          </div> 
         <% end %> 
         <br /><br /><%= f.link_to_add "Add a picture", :images ,:id=>"add_pic"%> 

工作

Answer 2

如果我們能看到css，會更容易。然而，它看起來像你的「圖像上傳」div或其周圍的窗體是窗口的寬度，所以你的新形式出現在以前的圖像下，而不是並排坐在一起。如果你減少這個div的寬度，它應該並排放置。