Versuchen Sie, jQuery-Datei-Upload auf Schienen einzubinden und zu verwenden und einige Fehler zu erzeugen?

Question

Ich versuche, eine App mit Schienen zu bauen, und in einigen Modul muss ich benutzerdefinierte Datei-Uploader verwenden, Ich versuche, jquery Datei-Upload zu verwenden, aber irgendwie wirft es mich einen Fehler? Hier

ist, was ich habe versucht:

ich unten Codes meine Juwel-Datei hinzugefügt:

group :assets do 
# Use jquery as the JavaScript library 
    gem 'jquery-rails' 
    gem 'jquery.fileupload-rails' 
end 

Hinweis: Ich habe auch versucht, meine Jquery-Datei-Upload Schienen gem außerhalb der Anlagengruppe zu setzen .

hinzugefügt, dies zu Anwendung js:

//= require jquery-fileupload/basic 

Wenn ich versuche, meine Ansicht zu gelangen, habe ich diesen Fehler bekam

couldn't find file 'jquery-fileupload/basic' with type 'application/javascript' 

oh FYI: Ich benutze Schienen 4.2.7 und windows 7 64 Bits.

Vergessen zu erwähnen, dass ich Bündel-Installationsbefehl auch ausgeführt habe.

apt Modell

class Apt < ActiveRecord::Base 




    belongs_to :developer 
    belongs_to :area 

    has_many :floorplans 
    accepts_nested_attributes_for :floorplans 




    validates :apt_name, presence: true 
    validates :apt_address, presence: true 
    validates :apt_desc, presence: true 





end 

Grundriss Modell

class Floorplan < ActiveRecord::Base 
    belongs_to :apt 

    mount_uploader :floorplanphoto, DefaultFileUploader 
end 

hier ist die Anfrage i tat

Anfrage

Parameter:

{"utf8"=>"✓", 
"authenticity_token"=>"mDfWGOI+lVOrOBmi038/oRFRoM5NUdkOL4caWPp30U/pLD41X5kpIur8Mdyqau5vE58C74BzXY7fvGfZn3dgLA==", 
"apt"=>{"apt_name"=>"twss", 
"apt_address"=>"xccxcxcx", 
"apt_lat"=>"", 
"apt_long"=>"", 
"thumbnail"=>#<ActionDispatch::Http::UploadedFile:0xaa3d018 @tempfile=#<Tempfile:C:/Users/lenovo/AppData/Local/Temp/RackMultipart20160811-9036-10xugyq.jpg>, 
@original_filename="Hydrangeas.jpg", 
@content_type="image/jpeg", 
@headers="Content-Disposition: form-data; name=\"apt[thumbnail]\"; filename=\"Hydrangeas.jpg\"\r\nContent-Type: image/jpeg\r\n">, 
"apt_desc"=>"xcxccxcx", 
"developer_id"=>"3", 
"area_id"=>"1", 
"apt_status"=>"draft", 
"facility_ids"=>["1", 
""], 
"poi_ids"=>["1", 
""]}, 
"floorplans"=>{"floorplanphoto"=>[#<ActionDispatch::Http::UploadedFile:0xaa3cce8 @tempfile=#<Tempfile:C:/Users/lenovo/AppData/Local/Temp/RackMultipart20160811-9036-9d1kdg.jpg>, 
@original_filename="Penguins.jpg", 
@content_type="image/jpeg", 
@headers="Content-Disposition: form-data; name=\"floorplans[floorplanphoto][]\"; filename=\"Penguins.jpg\"\r\nContent-Type: image/jpeg\r\n">]}} 

wie u es sehen kann, habe ich Grundrisse in meinem Parameter, aber es nicht definierte Methode []' for nil:NilClass Fehler wirft

Ich habe versucht, meine Parameter auf der Konsole zu drucken und es nicht über Grundrisse?

>> apt_params 
=> {"apt_name"=>"twss", "apt_address"=>"xccxcxcx", "apt_lat"=>"", "apt_long"=>"", "thumbnail"=>#<ActionDispatch::Http::UploadedFile:0xaa3d018 @tempfile=#<Tempfile:C:/Users/lenovo/AppData/Local/Temp/RackMultipart20160811-9036-10xugyq.jpg>, @original_filename="Hydrangeas.jpg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"apt[thumbnail]\"; filename=\"Hydrangeas.jpg\"\r\nContent-Type: image/jpeg\r\n">, "apt_desc"=>"xcxccxcx", "developer_id"=>"3", "area_id"=>"1", "apt_status"=>"draft", "facility_ids"=>["1", ""], "poi_ids"=>["1", ""]} 

Answer 1

Try this:

Statt mit Juwel das Skript herunterladen und halten es in app/assets/Javascripts Ordner. Angenommen, Ihr Skript befindet sich im Ordner jquery-fileupload und Sie müssen basic.js laden.

Jetzt in application.js Datei in App/Assets/Javascript Ordner einfach Zeile //= require jquery-fileupload/basic hinzufügen. Und starte deinen Server neu.

Dies muss Ihr Problem lösen.

Answer 2

Ich glaube, Sie remotipart gem

In Gemfile

gem 'remotipart' 

In Anwendung verwenden soll.js

//= require jquery.remotipart 
//= require_tree . 

Form

<%= form_for @apt, multipart: true, remote: true do |f|%> 
    <%= f.text_field :apt_name %> 
    <%= f.text_field :apt_address %> 
    <%= f.text_field :apt_desc %> 
    <%= f.fields_for :floorplans do |p| %> 
    <%= p.file_field :floorplanphoto, :multiple => true %> 
    <% end %> 
    <%= f.submit %> 
<% end %> 

app/controllers/apts_controller.js

def create 
    @apt = Apt.new(apt_params) 
    format_to do |format| 
    if @apt.save 
     apt_params[:floorplans].each do |a| 
     @floor_plans = @apt.floorplans.create!(a) 
     end 
     format.js {:locals => {:request => true}} 
    else 
     format.js {:locals => {:request => false}} 
    end 
    end 
end 

private 

def apt_params 
    params.require(:apt).permit(:apt_name, :apt_address, apt_desc, floorplans: [:id, :post_id, :floorplanphoto]) 
end 

views/users/create.js.erb

<% if remotipart_submitted? %> 
    if(<%= request %>) 
    // image is uploaded 
    else 
    // you can show here custom error msg 
<% else %> 
    // Error in xhr request 
<% end %> 

Es wird keine Änderungen im Modell.

Hoffe, das wird Ihnen helfen.