天天看點

XMLHttpRequest上傳檔案,并顯示進度條

function submitRequest(callback) {
		var apkFile = document.getElementById("file").files[0];
		if (apkFile) {
			var fileName = apkFile.name;
			var suff = fileName.substring(fileName.lastIndexOf('.') + 1,fileName.length);
			if (suff != "apk") {
				$.messager.alert("提示", messageCreator("檔案格式必須為apk!"));
				return;
		    }
		}
		
		
		var fd = new FormData();
		if (apkFile) {
			var apkName = apkFile.name;
			fd.append("apkName", apkName);
			fd.append("apkFile", apkFile);
		}
		var seq = $('#inputSeq').val();
		fd.append("seq", seq);
		fd.append("developer", $('#inputDeveloper').textbox('getText'));
		fd.append("isTop", $('#inputIsTop').combobox('getValue'));
		fd.append("isRecommend", $('#inputIsRecommend').combobox('getValue'));
		fd.append("isRelease", $('#inputIsRelease').combobox('getValue'));
		fd.append("description", $('#inputDescription').val());
		var xhr = new XMLHttpRequest();
	    xhr.upload.addEventListener("progress", uploadProgress, false);
		xhr.open('POST', AppContextPath + "/rest/app/save_app", true);
		/*
		xhr.onload = function() {
			$.messager.alert("提示", "添加成功", null, function() {
				window.top.iframeNavigator('ifrmContent','service/app_main.html');
				if (callback != null)
					callback();

			});
		};
		*/
		xhr.onreadystatechange = function() {
			if(xhr.readyState == 4 && xhr.status == 200){  
				$.messager.alert("提示", "添加成功", null, function() {
					window.top.iframeNavigator('ifrmContent','service/app_main.html');
					if (callback != null)
						callback();

				});
	        }else if(xhr.readyState == 4&& xhr.status != 200){
	        	 var jsonError = eval("(" + xhr.responseText + ")");
	        	 var errorType = jsonError.type;
	        	 if(errorType == "ApkDuplicate"){
	        		  $.messager.alert("提示", "該Apk已經上傳!", null, function() {window.top.iframeNavigator('ifrmContent','service/app_main.html');

					}); 
	        	 }
		         
	        }
		       
		    };
		    
		xhr.send(fd);
	}
	 
	  function uploadProgress(evt) {
	        if (evt.lengthComputable) {
	          var percentComplete = Math.round(evt.loaded * 100 / evt.total);
	             document.getElementById('progressNumber').innerHTML = '目前進度:'+percentComplete.toString() + '%';
	        }
	        else {
	             document.getElementById('progressNumber').innerHTML = 'unable to compute';
	        }
	      }