Question

我正在尝试使用rails构建应用，在某些模块中，我需要使用自定义文件上传器，我尝试使用jquery文件上传，但不知怎的，它给我一个错误？

以下是我的尝试：

我将以下代码添加到我的gem文件中：

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

注意：我还尝试将我的jquery文件上传rails rails gem放在资产组之外。

将此添加到应用程序js：

//= require jquery-fileupload/basic

当我尝试访问我的视图时，我收到了此错误

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

哦，仅供参考：我使用的是rails 4.2.7 和Windows 7 64位。

忘记提及我也运行了bundle install命令。

apt model

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

平面图模型

class Floorplan < ActiveRecord::Base
  belongs_to :apt

  mount_uploader :floorplanphoto, DefaultFileUploader
end

这是我做的请求：

请求

参数：

{"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">]}}

正如你可以看到的那样，我的参数中有平面图，但它会抛出未定义的方法[]' for nil:NilClass错误

我试图在控制台上打印我的参数而它没有平面图？

>>  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

试试这个：

而不是使用gem下载脚本并将其保存在app / assets / javascripts文件夹中。假设您的脚本位于文件夹jquery-fileupload中，您需要加载basic.js。

现在在app / assets / javascript文件夹中的application.js文件中添加行//= require jquery-fileupload/basic。然后重新启动服务器。

这必须解决你的问题。

Answer 2

我认为你应该使用remotipart gem

在Gemfile中

gem 'remotipart'

在application.js

中

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

形式

<%= 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 %>

应用程序/控制器/ 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

视图/用户/ 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 %>

模型没有变化。

希望这会对你有所帮助。

试图在rails上包含和使用jquery文件上传抛出一些错误？

2 个答案: