1

I have my own implementation of text editor and would like to allow users to upload files by dragging and dropping it to the text editor. The editor uses iframe. I am using rails and remotipart to do async upload of image files. I tried using this plugin: http://chrismbarr.github.io/FileDrop/ but I can't figure out how to upload files using remotipart. I tried using AJAX but I am sure it is not the right way and moreover it does not work either:

$('#wysiwygtextfield').contents().find("html").fileDrop(
     {
      onFileRead:function(fileCollection){

           $.each(fileCollection, function(){
    // I should probably be uploading files to the server using remotipart here. 
    // the plugin iterates through the collection of files that are dropped 
          });
                                          },
         removeDataUriScheme: true
     }); 
   }) ;

Please comment if you need more code, the upload action or the html. I am using the following form to do async uploads of files using the remotipart gem and it works fine:

<%= form_for(:image, :remote => true , :url => 'upload',:multipart => true , 
             :html => { :id => 'upload_qimage'}) do |f| %>

 <%= f.file_field :image, :placeholder => 'No file chosen',:onchange => "$(this).parents('form').submit(); before_submit() ; ",class: "image_textbox"  %>

<% end %>
Varun Jain
  • 1,901
  • 7
  • 33
  • 66
  • so what is your question? How to do ajax file upload? Or? – Arindam Feb 24 '14 at 11:12
  • I can already do ajax file upload using remotipart gem. This when the user tries to upload the file using the default 'Browse' functionality of the browser. I don't know how to do it on drag and drop. Will share code of the html form for uploading files using ajax. – Varun Jain Feb 24 '14 at 11:15
  • OK. then on drag/drop (I seem to remember there is a browser and a jQuery hook for them, in any case). you can simpy trigger the submit of the form right? – Arindam Feb 24 '14 at 11:19
  • I think there is jquery UI hook for that. But not sure if I can set contents of a field form to the dropped file. Doesn't browser security disallow that? – Varun Jain Feb 24 '14 at 11:21
  • You can do that inside the iframe. if the form is outside the iframe or anything to do involving the iframe, then you can't. Otherwise you very easily can. You'd have yourself set hidden form fields programmatically, on some user interaction etc – Arindam Feb 24 '14 at 11:25

0 Answers0