2012-12-18 2 views
0

저는 paperclip을 사용하여 css/js에 대한 프로필 사진 업로드 및 jasny 부트 스트랩을 관리하고 있습니다. 파일을 선택하지 않고 프로필 사진을 업로드하고 양식을 제출할 수 있습니다. 그러나 파일을 선택하고 양식을 제출하기 전에 파일을 제거 할 때 NoHandlerError를 생성합니다.레일즈 3 PaperClip NoHandlerError

나는 자바 스크립트에 익숙하지 않지만 "clear"함수가 ""(설정 : avatar => "") 파일을 비워 두지 않고 효과적으로 선택하기 때문에 생성 된 것 같습니다.

내 목표는 파일을 선택하고 제거한 다음 양식을 제출할 수있게하는 것입니다.

사전 도움을 받아 주셔서 감사합니다.

user.rb

class User < ActiveRecord::Base 
    has_attached_file :avatar, styles: { :default => "x150>", :thumbnail => "100x100>" }, 
         default_url: '/assets/missing_avatar.png' 
end 

_avatar.html.erb

<div class="fileupload fileupload-new" data-provides="fileupload"> 
    <div class="fileupload-preview thumbnail" style="width: 200px; height: 150px;"></div> 
    <div> 
    <span class="btn btn-file"><%= f.file_field :avatar %> 
     <span class="fileupload-new">Select image</span> 
     <span class="fileupload-exists">Change</span> 
     <input type="file" /> 
    </span> 
    <a href="#" class="btn fileupload-exists" data-dismiss="fileupload">Remove</a> 
    </div> 
</div> 

bootstrap.file-upload.js

!function ($) { 

    "use strict"; // jshint ;_ 

    var Fileupload = function (element, options) { 
    this.$element = $(element) 
    this.type = this.$element.data('uploadtype') ||  (this.$element.find('.thumbnail').length > 0 ? "image" : "file") 

    this.$input = this.$element.find(':file') 
    if (this.$input.length === 0) return 

    this.name = this.$input.attr('name') || options.name 

    this.$hidden = this.$element.find(':hidden[name="'+this.name+'"]') 
    if (this.$hidden.length === 0) { 
     this.$hidden = $('<input type="hidden" />') 
     this.$element.prepend(this.$hidden) 
    } 

    this.$preview = this.$element.find('.fileupload-preview') 
    var height = this.$preview.css('height') 
    if (this.$preview.css('display') != 'inline' && height != '0px' && height != 'none')  this.$preview.css('line-height', height) 

    this.$remove = this.$element.find('[data-dismiss="fileupload"]') 

    this.$element.find('[data-trigger="fileupload"]').on('click.fileupload',  $.proxy(this.trigger, this)) 

    this.listen() 
    } 

    Fileupload.prototype = { 

    listen: function() { 
     this.$input.on('change.fileupload', $.proxy(this.change, this)) 
     if (this.$remove) this.$remove.on('click.fileupload', $.proxy(this.clear, this)) 
    }, 

    change: function(e, invoked) { 
     var file = e.target.files !== undefined ? e.target.files[0] : (e.target.value ? { name: e.target.value.replace(/^.+\\/, '') } : null) 
     if (invoked === 'clear') return 

     if (!file) { 
     this.clear() 
     return 
     } 

     this.$hidden.val('') 
     this.$hidden.attr('name', '') 
     this.$input.attr('name', this.name) 

     if (this.type === "image" && this.$preview.length > 0 && (typeof file.type !==  "undefined" ? file.type.match('image.*') : file.name.match('\\.(gif|png|jpe?g)$')) && typeof FileReader !== "undefined") { 
     var reader = new FileReader() 
     var preview = this.$preview 
     var element = this.$element 

     reader.onload = function(e) { 
     preview.html('<img src="' + e.target.result + '" ' + (preview.css('max-height') != 'none' ? 'style="max-height: ' + preview.css('max-height') + ';"' : '') + ' />') 
     element.addClass('fileupload-exists').removeClass('fileupload-new') 
    } 

     reader.readAsDataURL(file) 
     } else { 
     this.$preview.text(file.name) 
     this.$element.addClass('fileupload-exists').removeClass('fileupload-new') 
     } 
    }, 

    clear: function(e) { 
     this.$hidden.val('') 
     this.$hidden.attr('name', this.name) 
     this.$input.attr('name', '') 
     this.$input.val('') // Doesn't work in IE, which causes issues when selecting the same file twice 

     this.$preview.html('') 
     this.$element.addClass('fileupload-new').removeClass('fileupload-exists') 

     if (e) { 
     this.$input.trigger('change', [ 'clear' ]) 
     e.preventDefault() 
     } 
    }, 

    trigger: function(e) { 
     this.$input.trigger('click') 
     e.preventDefault() 
    } 
    } 

답변

1

난 알것 해달라고 이 문제를 해결하는 rigth 방법이 있지만,이 컨트롤러 :

를 작동하는 경우

def update 
    @user = User.find(params[:id]) 
    respond_to do |format| 
     validate_avatar 
     if @user.update_attributes(params[:usuario]) 
     sign_in @usuario 
     format.html { redirect_to @user } 
     else 
     format.html { render action: "edit" } 
     end 
    end 
end 

는이 기능을 추가 승

def validate_avatar 
    params[:user].delete 'avatar' if params[:user]['avatar'] = "" 
end