我想制作一个简单的表格来上传音频文件。我想在用户提交文件时显示文件上传的进度条。我只想一次提交一个文件。
我的_upload.html.erb:
<%= form_for Sound.new do |f| %>
<%= f.file_field :fichier, name: 'sound[fichier]', :required => true %><br />
<%= f.text_field :title, :placeholder => 'Titre', :size => 10, :required => true %><br />
<%= f.submit 'Envoyer' %>
<%end%>
<div class="progress"><div class="bar" style="width: 0%;"></div></div>
我的 Js 文件:
$('#new_sound').submit(function() {
$('#new_sound').fileupload({
dataType: 'json',
progress: function (e, data){
var progress = parseInt(data.loaded / data.total * 100, 10);
$('.bar').css('width', progress + '%');
},
});
});
编辑:(我意识到我忘记了我的问题)实际上这并不是一个真正的问题,只是我不明白为什么它不起作用。使用这个 js:它可以工作,但我想等到用户点击提交,然后再上传文件。
$(function () {
$('#new_sound').fileupload({
dataType: 'json',
add: function (e, data){
data.submit();
},
progress: function (e, data){
var progress = parseInt(data.loaded / data.total * 100, 10);
$('.bar').css('width', progress + '%');
},
});
});