ruby - jQuery-File-Upload - Carrierwave - No progress callbacks -
like many others, i've followed rails-cast #381, jquery file upload, , after struggling, have of pieces working. can upload 1 or more files amazon s3 , create corresponding rows in database. i've been stuck couple of days though on getting progress bars work. appear , sit there while file upload , result appears in list when it's finished, bu progress bar stays white. problem seems i'm not getting callbacks. haven't been able work progress:, progressall:, or :done.
i have document model , upload straightforward. i'm using session id keep track of document until second step in process, added in create step. here's relevant code:
documents controller:
... def create @document = document.new(document_params) @document.session = request.session_options[:id] respond_to |format| if @document.save format.js format.html { redirect_to documents_path, notice: 'document created.' } format.json { render action: 'index', status: :created, location: @document } else format.js format.html { render action: 'new' } format.json { render json: @document.errors, status: :unprocessable_entity } end end documents.js.coffee
$ -> $('#new_document').fileupload datatype: "script" add: (e, data) -> data.context = $(tmpl("template-upload", data.files[0])) $('#new_document').append(data.context) data.submit() progress: (e, data) -> if data.context progress = parseint(data.loaded / data.total * 100, 10) data.context.find('.bar').css('width', progress + '%') progressall: (e, data) -> overallprogress = parseint(data.loaded / data.total * 100, 10); $('#all_progress .bar').css('width', overallprogress + '%') done: (e, data) -> alert("all finished") index.html.erb
(table of documents here - new uploads insert porperly) <h2>upload document</h2> <%= form_for document.new |f| %> <%= f.file_field :original, multiple: true, name: "document[original]" %> <!-- table listing files available upload/download --> <% end %> <div id="progress"> <div class="bar" style="width: 0%;"></div> </div> <div id="all_progress"> <div class="upload"> <div class="bar" style="width: 0%;"></div> </div> </div> <script id="template-upload" type="text/x-tmpl"> <div class="upload"> {%=o.name%} <div class="progress"> <div class="bar" style="width: 0%"> </div> </div> </div> </script> from javascript, should see alert pop-up @ end of upload well, never happens. show @ beginning of upload if put in add: section. that's working else under .fileupload seems never called.
suggestions on next?
things working (as seems happen when post question). should have noticed when did post, in 2 places thought had 4 spaces, had tab. apparently coffeescript not interpret tabs sets of spaces. didn't throw error, didn't line progress: (e, data) -> , underneath ignored.
Comments
Post a Comment