1 首先看一下上傳表格程式碼，主要程式碼如下：

	<form method="post" enctype="multipart/form-data" id="orderform">
					<div class="col-md-6 col-sm-12">
						<div class="block">


							<div class="form-group">
								<input id="file0" name="file0" type="file" multiple class="file"
									data-show-caption="true">
							</div>
 

2 上面程式碼中需要注意的事enctype和input 的type

3 來看一下ajax程式碼

$("#btn1").click(function() {

				var formData = new FormData($("#orderform")[0]);

			
				
						$.ajax({
							url : "file/text",
							type : "post",
							data : formData,
							dataType : "json",
							contentType : false,
							processData : false,
							success : function(data) {
								$("#file2").text("");
							
			 
						            $table = $("#table").bootstrapTable({
						                data: data.result,   //最終的JSON資料放在這裡					            
						 
						                height: $(window).height()*0.5,
						 
						                striped: true,//黑白相間
						 
						                pagination: true,
						 
						                pageNumber: 1,
						 
						                pageSize: 10,//每頁顯示幾條
						 
						                pageList: [5, 10, 20],//切換顯示條數
						 
						                search: true,
						 
						                showRefresh: true,
						 
						                sidePagination: "client",
						 
						                showColumns: true,
						 
						                minimunCountColumns: 2,
						 
						                columns: [ {
						 
						                    field: 'id',
						 
						                    title: 'ID',
						 
						                    align: 'center',
						 
						                    valign: 'center',
						 
						                    sortable: true
						 
						                },  {
						 
						                    field: 'desc',
						 
						                    title: 'Title',
						 
						                    align: 'center',
						 
						                    valign: 'center',
						                    
						                    width: 1000,
						 
						                    sortable: true
						 
						                }, {
						 
						                    field: 'pre',
						 
						                    title: 'Predict',
						 
						                    align: 'center',
						 
						                    valign: 'center',
						 
						                    sortable: true
						 
						                },{
						 
						                    field: 'gpre',
						 
						                    title: 'confidence level(Golgi-resident proteins)',
						 
						                    align: 'center',
						 
						                    valign: 'center',
						 
						                    sortable: true
						 
						                },{
					
						                    field: 'ngpre',
						 
						                    title: 'confidence level(non-Golgi-resident proteins)',
						 
						                    align: 'center',
						 
						                    valign: 'center',
						 
						                    sortable: true
						 
						                }]
						            });
						            
						          



								
 
							},
 

4 在上面的程式碼中需要注意一下幾點：

 第一是 $("#table").bootstrapTable("load",data.result); 作用是用來重新整理表格資料

第二是  data ： 填寫後臺傳過來的json資料

第三是  columns中field要和後端定義的vo對應

5 本文主要不是講解ajax所以ajax的屬性略過

6 進入後臺 看一下怎麼接收檔案然後進行IO操作；

public Map<String, Object> text(@RequestParam(value = "file0", required = false) CommonsMultipartFile file,
			HttpServletRequest request, HttpServletResponse response) throws Exception {
 

7 spingmvc的頭部是這樣寫的，注意一下就好；

8 IO操作如下：

OutputStream os = new FileOutputStream(fastapath);

			InputStream is = file.getInputStream();

			byte[] buffer = new byte[1048576];
			int temp;
			while ((temp = is.read(buffer)) != -1) {

				os.write(buffer, 0, temp);

9 這樣就將資料上傳到伺服器了。

10 接下來就是在後臺對資料的一串處理；（略）

11 處理中將自己要的資料裝進vo，然後通過map傳遞給前端.