jacknudt
/
socialforge
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

个人资源库，课程 资源文件上传 

1.单个上传
 2.给出明确的提示
 3.按钮联动
This commit is contained in:
lizanle 2015-11-12 16:35:13 +08:00
parent 9b2ccca649
commit 506709b474
1 changed files with 59 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

95
public/javascripts/attachments.js
View File

@ -155,13 +155,13 @@ function addFile(inputEl, file, eagerUpload,btnId) {
addFile.nextAttachmentId = 1; addFile.nextAttachmentId = 1;
function ajaxUpload(file, attachmentId, fileSpan, inputEl,btnId) { function ajaxUpload(file, attachmentId, fileSpan, inputEl,btnId) {
//上传开始调用函数
function onLoadstart(e) { function onLoadstart(e) {
fileSpan.removeClass('ajax-waiting'); fileSpan.removeClass('ajax-waiting');
fileSpan.addClass('ajax-loading'); fileSpan.addClass('ajax-loading');
$('input:submit', $(this).parents('form')).attr('disabled', 'disabled'); $('input:submit', $(this).parents('form')).attr('disabled', 'disabled');
} }
//更改progressbar的值
function onProgress(e) { function onProgress(e) {
if (e.lengthComputable) { if (e.lengthComputable) {
this.progressbar('value', e.loaded * 100 / e.total); this.progressbar('value', e.loaded * 100 / e.total);
@ -177,40 +177,43 @@ function ajaxUpload(file, attachmentId, fileSpan, inputEl,btnId) {
progressEventHandler: onProgress.bind(progressSpan) progressEventHandler: onProgress.bind(progressSpan)
}) })
.done(function(result) { .done(function(result) {
progressSpan.progressbar('value', 100).remove(); progressSpan.progressbar('value', 100).remove(); //上传完成就去掉该文件名后的进度条
var containerid = $(inputEl).data('containerid');
console.log($(inputEl))
if(containerid == undefined ){
var count = $('#attachments_fields>span').length;
$('#'+btnId).removeAttr("disabled");
$('#'+btnId).val('确定')
$('#'+btnId).css('background-color','#269ac9')
$('#upload_file_count').html("<span id=\"count\">" + count + "</span>" + $(inputEl).data('fileCount'));
}
else{
$('#'+btnId).removeAttr("disabled");
$('#'+btnId).val('确定')
$('#'+btnId).css('background-color','#269ac9')
var count = $('#attachments_fields' + containerid + '>span').length;
$('#upload_file_count' + containerid).html("<span id=\"count\">" + count + "</span>" + $(inputEl).data('fileCount'));
}
fileSpan.find('input.description, a').css('display', 'inline-block'); fileSpan.find('input.description, a').css('display', 'inline-block');
fileSpan.find('input.is_public_checkbox, a').css('display', 'inline-block'); fileSpan.find('input.is_public_checkbox, a').css('display', 'inline-block');
}) })
.fail(function(result) { .fail(function(result) {
progressSpan.text(result.statusText); progressSpan.text("网络错误");
if ($("#network_issue")) { if ($("#network_issue")) { //在上传处都要给出一个network_issue的div用来显示错误
$("#network_issue").show(); $("#network_issue").show();
} }
}).always(function() { }).always(function() {
ajaxUpload.uploading--; ajaxUpload.uploading--;
fileSpan.removeClass('ajax-loading'); fileSpan.removeClass('ajax-loading');
var form = fileSpan.parents('form'); var containerid = $(inputEl).data('containerid');//多个上传控件需要的容器id
if (form.queue('upload').length == 0 && ajaxUpload.uploading == 0) { if(containerid == undefined ){
$('input:submit', form).removeAttr('disabled'); var count = 1;//同步上传参数为1，所以不需要去获取正在上传的文件就知道是1
$('#upload_file_count').html("<span id=\"count\">" + count + "</span>" + $(inputEl).data('lebelFileUploding'));
} }
form.dequeue('upload'); else{
var count = 1;
$('#upload_file_count' + containerid).html("<span id=\"count\">" + count + "</span>" + $(inputEl).data('lebelFileUploding'));
}
var form = fileSpan.parents('form');
if (form.queue('upload').length == 0 && ajaxUpload.uploading == 0) { //所有文件上传完毕,更改状态
$('input:submit', form).removeAttr('disabled');
$('#' + btnId).removeAttr("disabled");
$('#' + btnId).val('确定')
$('#' + btnId).css('background-color', '#269ac9')
if(containerid == undefined ){
var count = $('#attachments_fields>span').length;
$('#upload_file_count').html("<span id=\"count\">" + count + "</span>" + $(inputEl).data('fileCount'));
}else{
var count = $('#attachments_fields' + containerid + '>span').length;
$('#upload_file_count'+containerid).html("<span id=\"count\">" + count + "</span>" + $(inputEl).data('fileCount'));
}
}
form.dequeue('upload');//上传完成一个就退出一个
}); });
//gcm files count and add delete_all link //gcm files count and add delete_all link
@ -222,7 +225,7 @@ function ajaxUpload(file, attachmentId, fileSpan, inputEl,btnId) {
$('#'+btnId).attr("disabled",true); $('#'+btnId).attr("disabled",true);
$('#'+btnId).val('提交中'); $('#'+btnId).val('提交中');
$('#'+btnId).css('background-color','#c1c1c1') $('#'+btnId).css('background-color','#c1c1c1')
$('#upload_file_count').html("<span id=\"count\">" + count + "</span>" + $(inputEl).data('lebelFileUploding')); $('#upload_file_count').html("<span id=\"count\">1</span>" + $(inputEl).data('lebelFileUploding'));//目前肯定是穿一个文件
if (count >= 1) { if (count >= 1) {
var add_attachs = $('.add_attachment'); var add_attachs = $('.add_attachment');
var delete_all = $('.remove_all'); var delete_all = $('.remove_all');
@ -239,7 +242,7 @@ function ajaxUpload(file, attachmentId, fileSpan, inputEl,btnId) {
$('#'+btnId).attr("disabled",true); $('#'+btnId).attr("disabled",true);
$('#'+btnId).val('提交中'); $('#'+btnId).val('提交中');
$('#'+btnId).css('background-color','#c1c1c1') $('#'+btnId).css('background-color','#c1c1c1')
$('#upload_file_count' + containerid).html("<span id=\"count\">" + count + "</span>" + $(inputEl).data('lebelFileUploding')); $('#upload_file_count' + containerid).html("<span id=\"count\">1</span>" + $(inputEl).data('lebelFileUploding'));//目前肯定是穿一个文件
if (count >= 1) { if (count >= 1) {
var add_attachs = $('.add_attachment').filter(function(index) { var add_attachs = $('.add_attachment').filter(function(index) {
return $(this).data('containerid') == containerid; return $(this).data('containerid') == containerid;
@ -262,17 +265,25 @@ function ajaxUpload(file, attachmentId, fileSpan, inputEl,btnId) {
//gcm //gcm
} }
//在插入文件名的后边插入div
var progressSpan = $('<div>').insertAfter(fileSpan.find('input.upload_filename')); var progressSpan = $('<div>').insertAfter(fileSpan.find('input.upload_filename'));
progressSpan.progressbar(); progressSpan.progressbar(); //将div处理成progress bar
fileSpan.addClass('ajax-waiting'); fileSpan.addClass('ajax-waiting'); //添加文件正在上传的状态
var containerid = $(inputEl).data('containerid');//多个上传控件需要的容器id
var maxSyncUpload = $(inputEl).data('max-concurrent-uploads'); if(containerid == undefined ){ //选择了多少个文件也要显示，因为有时候文件过大，一时半会传不完，但还是显示文件没有选择
var count = $('#attachments_fields>span').length;
$('#upload_file_count').html("<span id=\"count\">" + count + "</span>" + '个文件被选择');
}else{
var count = $('#attachments_fields' + containerid + '>span').length;
$('#upload_file_count'+containerid).html("<span id=\"count\">" + count + "</span>" + '个文件被选择');
}
//最大的同步上传参数
var maxSyncUpload = 1 //$(inputEl).data('max-concurrent-uploads');
//如果没有指定同步上传参数 或者参数不对，或者需要上传的文件已经小于同步上传的个数，那么直接上传
if (maxSyncUpload == null || maxSyncUpload <= 0 || ajaxUpload.uploading < maxSyncUpload) if (maxSyncUpload == null || maxSyncUpload <= 0 || ajaxUpload.uploading < maxSyncUpload)
actualUpload(file, attachmentId, fileSpan, inputEl,btnId); actualUpload(file, attachmentId, fileSpan, inputEl,btnId);
else else //否则就进行队列上传
$(inputEl).parents('form').queue('upload', actualUpload.bind(this, file, attachmentId, fileSpan, inputEl)); $(inputEl).parents('form').queue('upload', actualUpload.bind(this, file, attachmentId, fileSpan, inputEl,btnId));
} }
ajaxUpload.uploading = 0; ajaxUpload.uploading = 0;
@ -338,6 +349,10 @@ function uploadBlob(blob, uploadUrl, attachmentId, options) {
function addInputFiles(inputEl,btnId) { function addInputFiles(inputEl,btnId) {
// var clearedFileInput = $(inputEl).clone().val(''); // var clearedFileInput = $(inputEl).clone().val('');
if (inputEl.files) { if (inputEl.files) {
// if(inputEl.files.length >= 5){
// alert('一次选择的文件不能超过5个')
// return;
// }
// upload files using ajax // upload files using ajax
uploadAndAttachFiles(inputEl.files, inputEl,btnId); uploadAndAttachFiles(inputEl.files, inputEl,btnId);
// $(inputEl).remove(); // $(inputEl).remove();
@ -365,6 +380,10 @@ function addInputFiles_board(inputEl, id,btnId) {
// var clearedFileInput = $(inputEl).clone().val(''); // var clearedFileInput = $(inputEl).clone().val('');
if (inputEl.files) { if (inputEl.files) {
// if(inputEl.files.length >= 5){
// alert('一次选择的文件不能超过5个')
// return;
// }
// upload files using ajax // upload files using ajax
uploadAndAttachFiles_board(inputEl.files, inputEl, id,btnId); uploadAndAttachFiles_board(inputEl.files, inputEl, id,btnId);
// $(inputEl).remove(); // $(inputEl).remove();
@ -497,6 +516,10 @@ function addInputFilesCourseSource(inputEl) {
btnId = arguments[2]; btnId = arguments[2];
// var clearedFileInput = $(inputEl).clone().val(''); // var clearedFileInput = $(inputEl).clone().val('');
if (inputEl.files) { if (inputEl.files) {
// if(inputEl.files.length >= 5){
// alert('一次选择的文件不能超过5个')
// return;
// }
// upload files using ajax // upload files using ajax
uploadAndAttachFilesCourseSource(inputEl.files, inputEl,checkBox,btnId); uploadAndAttachFilesCourseSource(inputEl.files, inputEl,checkBox,btnId);
// $(inputEl).remove(); // $(inputEl).remove();