
 
 | 
| 技术资料  > ASP技术 > 客户端相关 : 使用隐藏form把数据从客户端传到服务端 |  
使用隐藏form把数据从客户端传到服务端 March 25,2004 |  
源程序下载在本站的源程序栏的html一代类型里,名为隐藏窗体的应用例子 
 
Using hidden forms to transfer data from client side to Server side and vice-versa 
 
Author: Sudhakar M 
Level of Difficulty: Beginner 
Languages covered: ASP, JavaScript 
Pre-required reading: None 
Date: Apr 19, 2000 
 
  
Introduction 
 
This paper discusses how to use hidden forms to transfer data from client side to server-side and vice- 
versa. This approach is needed when you have an ASP application, with the individual pages dealing with  
only a part of the whole data involved, but at a later time, such as exiting the application, all of the  
data entered intermediately so far is needed. 
 
One obvious approach is to use Session variables. Session variables need cookies to be enabled to work.  
But what if cookies are disabled? Also in today's e-commerce applications there are scenarios where random  
servers service the browser requests depending on the load (load-balanced), so there is no session  
involved. This is an alternative approach to session variables and cookies. 
 
The Approach 
 
I will discuss the approach by a simple example. Suppose I have an ASP application with three pages  
Name.asp, Address.asp, database.asp. The user navigates from one page to another page entering the  
information along the way in the first two pages. Also after the information is entered in each particular  
page, the server side needs the information, to make some decisions, like to pull some more data out of a  
database based on the entered values and send it to the next page. This process continues until the user  
reaches the last page, when all of the previous data is committed to the database. The trickiest part is  
the information entered in any of the intermediate pages and information deduced from the server side  
after submitting a page will be needed anywhere in the subsequent pages and moreover all of the  
information will be needed in the last page. 
 
The following, Hidden.inc, include file declares the server side variables for all the state involved, a  
helper function that will be used every time at the beginning of a page on the server side: 
 
 
Var FirstName=""; 
Var LastName=""; 
Var Address=""; 
 
// The following SaveState() function will retrieve 
// the submitted state from the hidden frame on any given page 
 
Function SaveState() 
{ 
    FirstName = ""; 
    FirstName =    Request.Form("FirstName").Item; 
 
    LastName = ""; 
    LastName    =    Request.Form("LastName").Item; 
             
    Address    = ""; 
    Address =    Request.Form("Address").Item; 
 
} 
 
 
This include file will be included in every page on the server side. 
 
The following is a typical client side include file, Formstate.inc, containing the hidden form, which will  
have all the fields involved in the application: 
 
 
<FORM NAME="FormState"> 
      <INPUT TYPE=HIDDEN NAME=FirstName> 
      <INPUT TYPE=HIDDEN NAME=LastName> 
      <INPUT TYPE=HIDDEN NAME=Address> 
</FORM> 
 
 
Now lets move on to the actual ASP pages where the interesting action happens. This is how Name.Asp might  
look: 
 
 
<%@ Language=JavaScript %> 
 
<html><head><title>Name </title> 
<!-- #include file = "Helper.inc" --> 
 
<% 
SaveState(); 
//Bunch of other server side stuff. 
%> 
 
<!-- //client side ? 
<script LANGUAGE="javascript"> 
<!- 
 
function SubmitHiddenForm(page) 
{ 
    var State =  document.FormState; 
       
// if the value is not modified in this page you inline it from the  
// value what you got from the server side like below  
State.FirstName.value     =    "<%=FirstName%>"; 
 
//Otherwise probably pull it out from the client side form and put it 
// here 
    State.LastName.value = document. formName.LastName.Value; 
 
//Assuming the following will not change in this page the rest of them 
// are stored in the client side hidden frame as follows 
    State.City.value    =    "<%=City%>"; 
     
 
State.action = page; 
    State.submit(); 
} 
 
function doNext() 
{ 
    SubmitHiddenForm("NextPage.asp"); 
} 
 
? 
</script> 
 
<body> 
 
<form NAME="formGetName" METHOD="POST"> 
<input TYPE="EDIT" NAME="LastName"   > 
 
<!-The button? 
<a HREF="JavaScript:doNext();"> 
<img NAME="Next" src="nextbutton.gif"></a> 
</form> 
 
<!-Inline the hidden form here? 
<!-- #include file = "FormState.inc" --> 
 
</body> 
 
 
The key is, as you might have understood is to first generate a function that will hold all the values got  
from the server side (like in the above for FirstName). If a particular variable is going to get it's  
value from this page then instead of initializing it from the server side variable, read it from the  
client side form variable or whatever (like the above for LastName). 
 
Then in response to submission we have to call SubmitHiddenForm() function which effectively posts all the  
data to the server side and the server side again in that page generates a similar page, which will save  
all the data in the client side variables of that current page. This process continues on to the last page  
where probably on the server side we use all the collected information and persist to a database. |  
 
 | 
  
Copyright © 2001-2008 Shenzhen Hiblue Software Team All rights reserved