javascript - Railscast #383 add/remove uploader form and script via AJAX -
i've got uploader working railscast #383, there way add , remove uploader link via ajax?
i need pass in "service" instance id.
the code add or remove via ajax below:
<%= s3_uploader_form post: images_url(:service_id => service.id), as: "image[url]" %> <%= file_field_tag :file, multiple: true %> <% end %> <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>
ok figured out. main problem having uploader coffeescript not executing again after form added via ajax. revised #136 railscast got basic ajax form working, in order uploader form working via ajax, included uploader coffeescript normal javascript in new.js.erb file. way when new.js.erb file executed, loads form , executes uploader javascript.
new.js.erb:
$('#new_link').hide().after('<%= j render("images/form") %>'); jquery(function() { return $('#fileupload').fileupload({ add: function(e, data) { var file, types; 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)); $('#fileupload').append(data.context); data.form.find('#content-type').val(file.type); return data.submit(); } else { return alert("" + file.name + " not gif, jpeg, or png image file"); } }, progress: function(e, data) { var progress; if (data.context) { progress = parseint(data.loaded / data.total * 100, 10); return data.context.find('.bar').css('width', progress + '%'); } }, done: function(e, data) { var content, domain, file, path, to; file = data.files[0]; domain = $('#fileupload').attr('action'); path = $('#fileupload input[name=key]').val().replace('${filename}', file.name); = $('#fileupload').data('post'); content = {}; content[$('#fileupload').data('as')] = domain + path; $.post(to, content); if (data.context) { return data.context.remove(); } }, fail: function(e, data) { alert("" + data.files[0].name + " failed upload."); console.log("upload failed:"); return console.log(data); } }); });
Comments
Post a Comment