在rails 4中上传Jquery文件

大家好,我正在http://railscasts.com/episodes/381-jquery-file-upload上关注Jquery文件上传的video教程,我被困了。 我上传图像后,我的渲染部分不会刷新,它会添加新图像和已附加图像下的所有其他图像。 因此,如果我将两个图像添加到新项目中,则显示第一个图像,然后使用第一个图像再次渲染部分图像,并在第一个图像下再渲染第二个图像,因此总共有3张照片。

这是我的create.js.erb

 alert("Failed to upload photo: ");  $("#photos").append("");  

这是我的展示页面中的渲染。

 

这是我的/photos/_photos.html.erb部分

 

Images

Photo:

这是我的照片控制器创建

  def create @rental = Rental.find(params[:rental_id]) @photo = @rental.photos.create(params[:photo].permit(:image)) respond_to do |format| format.js end end 

这是我的照片.js.jcoffee

 jQuery -> $('#new_photo').fileupload(replaceFileInput: false, paramName: 'photo[image]') dataType: "script" add: (e, data) -> types = /(\.|\/)(gif|jpe?g|png)$/i file = data.files[0] if types.test(file.type) || types.test(file.name) data.context = $(tmpl("template-upload", file)) $('#new_photo').append(data.context) data.submit() else alert("#{file.name} is not a gif, jpeg, or png image file") progress: (e, data) -> if data.context progress = parseInt(data.loaded / data.total * 100, 10) data.context.find('.bar').css('width', progress + '%') 

任何帮助都会很棒,我被困住了。 谢谢!


非常感谢Rich Peck他的回答完全解决了我的问题。 我不得不改变

  alert("Failed to upload photo: ");  $("#photos").append("");  

  alert("Failed to upload photo: ");  $("#photos").html("");  

 def create @rental = Rental.find(params[:rental_id]) @photo = @rental.photos.create(params[:photo].permit(:image)) respond_to do |format| format.js end end 

这是我第一次看到它


修复实际上是使用$('#photos').html()来替换容器。 OP最初使用.append只是将内容附加到容器,这根本不起作用