1. 程式人生 > >簡單解決 multipart/form-data 檔案上傳表單中 傳遞引數無法獲取的辦法! (解決辦法:動態更改表單提交URL)

簡單解決 multipart/form-data 檔案上傳表單中 傳遞引數無法獲取的辦法! (解決辦法:動態更改表單提交URL)

 在jsp(其它動態web頁面好像也存在)中,如果要上傳檔案,表單的enctype就必須設定為"multipart/form-data"了,這樣就能夠傳遞檔案資料,卻無法傳遞引數,如下的表單:

[xhtml] view plaincopyprint?
01.<form action="uploadImage.jsp" method="post" enctype="multipart/form-data" name="form1" onsubmit="javascript:checkForm(this);">  
02.請選擇上傳的圖片  
03. <input type="hidden" name="action" value="upload" />  
04.    <input type="file" name="file">  
05.<input type="submit" name="Submit" value="上傳">  
06.    </form>  
<form action="uploadImage.jsp" method="post" enctype="multipart/form-data" name="form1" onsubmit="javascript:checkForm(this);">
請選擇上傳的圖片
 <input type="hidden" name="action" value="upload" />
    <input type="file" name="file">
<input type="submit" name="Submit" value="上傳">
    </form> 

這是本人程式中的一段程式碼,本人是想傳遞一個引數過去的,可是怎麼都無法傳遞過去,request.getParameter("action")總是null,開始還以為是程式問題,後來在百度上一看,發現大家都存在這個問題。

 

解決方法一: 

通過實驗發現在表單中的URL中附加引數可以在提交表單後獲取到值,採用固定引數的方式,於是將上面的表單改為如下:

[xhtml] view plaincopyprint?
01.<form action="uploadImage.jsp?action=upload" method="post" enctype="multipart/form-data" name="form1" onsubmit="javascript:checkForm(this);">  
02.請選擇上傳的圖片  
03.    <input type="file" name="file">  
04.<input type="submit" name="Submit" value="上傳">  
05.    </form>  
<form action="uploadImage.jsp?action=upload" method="post" enctype="multipart/form-data" name="form1" onsubmit="javascript:checkForm(this);">
請選擇上傳的圖片
    <input type="file" name="file">
<input type="submit" name="Submit" value="上傳">
    </form> 

 

request.getParameter("action")="upload",問題解決。當然這樣的解決方法不是很完美,但是相比那些複雜的解決辦法來說,這個是最簡單的。

 

解決方法二: 

在實際開發中可能一個表單會根據實際情況提交到不同的URL的情況,這種情況在採用了MVC的框架中尤其常見。最近幾年時間裡周公比較少寫網頁程式碼,偏重於設計和業務邏輯處理了,不過最近自己研究時遇到這麼一個情況,發現一個不錯的方法。原理是將原來的提交表單更改為普通的按鈕,點選按鈕時呼叫一個javascript方法,在這個方法里根據業務邏輯動態更改表單提交的URL,然後再呼叫javascript提交表單,經過驗證不但能解決上面的問題,而且處理方式更靈活。程式碼如下:

[xhtml] view plaincopyprint?
01.<script language="javascript" type="text/javascript"><!--  
02.    //動態更改表單提交URL的示例  
03.    //程式碼:周公  
04.    //日期:2010-03-18  
05.    function changeSubmitUrl()  
06.    {  
07.        //定義表單要提交的URL,這裡可以根據邏輯動態更改,甚至可以採用<%= url %>這種方式  
08.        var url="uploadImage.jsp?action=upload";  
09.        //將表單的action的URL更改為我們希望提交的URL  
10.        document.form1.action=url;  
11.        //利用Javascript提交表單  
12.        document.form1.sumbit();  
13.    }  
14.// --></mce:script>      
15.<form  method="post" enctype="multipart/form-data" name="form1" onsubmit="javascript:checkForm(this);">  
16.請選擇上傳的圖片  
17.    <input type="file" name="file">  
18.<input type="button" name="Submit" onclick="javascript:changeSubmitUrl();" value="上傳">  
19.    </form>  
<script language="javascript" type="text/javascript"><!--
	//動態更改表單提交URL的示例
	//程式碼:周公
	//日期:2010-03-18
	function changeSubmitUrl()
	{
		//定義表單要提交的URL,這裡可以根據邏輯動態更改,甚至可以採用<%= url %>這種方式
		var url="uploadImage.jsp?action=upload";
		//將表單的action的URL更改為我們希望提交的URL
		document.form1.action=url;
		//利用Javascript提交表單
		document.form1.sumbit();
	}
// --></mce:script>    
<form  method="post" enctype="multipart/form-data" name="form1" onsubmit="javascript:checkForm(this);">
請選擇上傳的圖片
    <input type="file" name="file">
<input type="button" name="Submit" onclick="javascript:changeSubmitUrl();" value="上傳">
    </form>