Проблема скрепки с ajax

Question

Я читаю этот учебник: http://sleekd.com/general/adding-multiple-images-to-a-rails-model-with-paperclip/ , потому что мне нужно сохранить изображения продукта в независимой модели. Однако при выполнении Product.create не сохранять данные для модели изображений продукта.

ПРИМЕЧАНИЕ: Я использую новое действие пакета, потому что мне нужно использовать ajax для создания нового продукта.

Пожалуйста, мне нужна помощь.

Мой код

Контроллеры

class Admin::PacksController < ApplicationController 
     def new 
     @pack = Pack.new 
     @product = Product.new 
     4.times {@product.product_images.build} # added this 
     respond_to do |format| 
      format.html # new.html.erb 
      format.xml { render :xml => @pack } 
     end 
     end 

     def create_starred_product 
     product = Product.new(params[:product]) 
     product.save 
... 

     end 

Посмотреть

<% form_remote_for @product, :url => {:controller => "products", :action => "create_starred_product"}, :html => {:multipart => true} do |f| %> 
     <div id="content"> 
....#OTHER FIELDS OF PRODUCT. ITS SAVE METHOD IS OK 
     <div id="images-selector"> 
      <span class="fleft">Imágenes</span><br/> 
      <% count = 0 %> 
      <% f.fields_for :product_images do |builder| %> 

       <% if builder.object.new_record? %> 
        <label> 
        Imagen <%= "#{count = count + 1}" %> 
        </label> 
        <%= builder.file_field :photo, :class => "textarea" -%><br/> 
       <% end %> 
      <% end %> 
     </div> 
     <p><%= f.submit "Crear" %></p> 
     </div> 
    <% end %> 

Модели

class Product < ActiveRecord::Base 
    has_many :packs, :through => :pack_products 
    has_many :product_images, :dependent => :destroy 
    #PAPERCLIP 
    accepts_nested_attributes_for :product_images, :reject_if => lambda { |t| t['product_image'].blank? } 
end 

class ProductImage < ActiveRecord::Base 
    belongs_to :product 
    has_attached_file :photo, :url => "/:attachment/:class/:id/:style_:basename.:extension", :styles => { :medium => "300x300>", :thumb => "100x100>", :small => "30x30>" } 
end 

Answer 1

Вы не можете загружать файлы с помощью AJAX, так же, как вы сказали. Однако существуют альтернативные решения.

Общей методикой для этого является использование iframe. Посмотрите here, этот учебник ориентирован на attachment_fu, но он будет работать и с скрепкой. Uploadify стоит проверить и может также использоваться с скрепкой на rails 2.3 и rails 3.

Answer 2

Я нашел решение вместе с моим партнером.

Моя ошибка была в форме вложенных атрибутов, нет в Ajax.so Я нашел решение для использования paperclip с Ajax. Теперь я разместил пример кода.

Однако я объясняю код.

Модель

Две модели

продукт и Product_images

Я хотел, чтобы, когда я создал продукт в АЯКСЕ формы (каждый продукт belongs_to пакета). Каждый продукт имеет много изображений в модели product_images. Поэтому я тоже хотел сохранить изображения.

Код

Контроллер Ajax действие

class ProductsController < ApplicationController 
     def create_starred_product 
     product = Product.new(params[:product]) 
     product.save 

     render :update do |page| 
      page.replace_html 'star-product', :partial => "admin/products/star_product_name", :locals => {:star_product => product} 
      page.call "$j.modal.close" 
     end 
end 

    end 

Модели

Продукты модели

class Product < ActiveRecord::Base 
    has_many :packs, :through => :pack_products 
    has_many :product_images, :dependent => :destroy 

    #PAPERCLIP 
    accepts_nested_attributes_for :product_images#, :reject_if => lambda { |t| t['product_image'].blank? } 

    has_attached_file :photo, :url => "/:attachment/:class/:id/:style_:basename.:extension", :styles => { :medium => "300x300>", :thumb => "100x100>", :small => "30x30>" } 

Product_images модель

class ProductImage < ActiveRecord::Base 
    belongs_to :product 

    has_attached_file :photo, :url => "/:attachment/:class/:id/:style_:basename.:extension", :styles => { :medium => "300x300>", :thumb => "100x100>", :small => "30x30>" } 
end 

end 

Посмотреть всплывающее окно в AJAX (Это частичное)

<script type="text/javascript"> 
    $j(document).ready(function() { 
     $j('#product_submit').click(function(event) { 
      event.preventDefault(); 
      $j('#uploadForm').ajaxSubmit({ 
       beforeSubmit: function(a, f, o) { 
        o.dataType = 'json'; 
       }, 
       complete: function(XMLHttpRequest, textStatus) { 
        // XMLHttpRequest.responseText will contain the URL of the uploaded image. 
        // Put it in an image element you create, or do with it what you will. 
        // For example, if you have an image elemtn with id "my_image", then 
        // $('#my_image').attr('src', XMLHttpRequest.responseText); 
        // Will set that image tag to display the uploaded image. 
       } 
      }); 
     }); 
    }); 
</script> 
<div id="new-starred-product" class="popup clearfix"> 
    <div id="header">Nuevo producto estrella</div> 
    <% remote_form_for @product, :url => {:controller => "products", :action => "create_starred_product"}, :html => {:method => :post, :id => 'uploadForm', :multipart => true} do |f| %> 
     <div id="content"> 
     <label>Nombre:</label> <%= f.text_field :name, :class => "textarea" %> 
     <br/> 
     <label>Precio:</label> <%= f.text_field :price, :class => "textarea" %> 
     <br/> 
     <%#= f.file_field :photo %> 
     <div id="images-selector"> 

      <% count = 0 %> 
      <%# f.fields_for "product_images_attributes[]", ProductImage.new do |builder| %> 
      <% f.fields_for :product_images, 4.times {ProductImage.new} do |builder| %> 
       <% if builder.object.new_record? %> 
        <label> 
        Imagen <%= "#{count = count + 1}" %> 
        </label> 
        <%= builder.file_field :photo, :class => "file-upload" -%><br /> 
        <br/> 
       <% end %>    
       <%#= builder.text_field :testfield %> 
<!--ACA VA EL CODIGO PARA IMAGENES--> 
      <% end %> 
     </div> 
     <br/> 
     <label>Descripción</label><%= f.text_area :description, :rows => 10, :class => "textarea clearfix" -%> 
     <br/> 

     <p> 
      <%#= f.submit "Crear" %> 
     <%= link_to "Crear", "#", :id => "product_submit" %> 
     </p> 
     </div> 
    <% end %> 
</div> 

Я использую JQuery и JQuery-плагин формы (поиск в Google)

Answer 3

Вы найдете две версии АЯКС загрузки на https://github.com/apneadiving/Pic-upload---Crop-in-Ajax.

Отрасль master: он использует http://aquantum-demo.appspot.com/file-upload

филиал uploadify: Он использует Uploadify: http://www.uploadify.com/

Оба имеют встроенные Crop.

Answer 4

Проблема Была вложенными атрибуты form.later я разместил код

Answer 5

Еще один драгоценный камень, чтобы помочь с этим вопросом я только что нашел, когда у меня была такая же проблема является remotipart - очень рекомендуется.