[英]RoR: jquery file upload on submit form button
How do I make it so my submit button will upload the images? 如何做到这一点,以便我的提交按钮可以上传图像?
<%= simple_form_for @project, html: { multipart: true, id: 'fileupload' } do |f| %>
<span class="btn btn-success fileinput-button">
<i class="glyphicon glyphicon-plus"></i>
<span>Add files...</span>
<input type="file" name="photos[]" id='photo_upload_btn', multiple>
</span>
<button type="submit" class="btn btn-primary start">
<i class="glyphicon glyphicon-upload"></i>
<span>Start upload</span>
</button>
<button type="reset" class="btn btn-warning cancel">
<i class="glyphicon glyphicon-ban-circle"></i>
<span>Cancel upload</span>
</button>
<%= f.button :submit, class: "btn btn-primary pull-right" %>
<% end %>
<script>
$(function () {
'use strict'; //not even sure what this is for
$('#fileupload').fileupload({
});
// Load existing files:
$('#fileupload').addClass('fileupload-processing');
$.ajax({
url: $('#fileupload').fileupload('option', 'url'),
dataType: 'json',
context: $('#fileupload')[0]
}).always(function () {
$(this).removeClass('fileupload-processing');
}).done(function (result) {
$(this).fileupload('option', 'done')
.call(this, $.Event('done'), {result: result});
});
});
</script>
Right now, when I upload an image, it'll show thumbnail preview and start button with a cancel button. 现在,当我上传图片时,它将显示缩略图预览和带有取消按钮的开始按钮。 I want to move the start button and have it all upload using the submit button. 我想移动开始按钮,并使用提交按钮将其全部上传。
Try below sample - 请尝试以下示例-
$('#fileupload').fileupload({
dataType: 'json',
add: function (e, data) {
$(".btn-primary").off('click').on('click', function () {
data.submit();
});
},
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.