SiteExperts.com Logo Home | Community | Developer's Paradise | Jobs
User Groups | Site Tools | Site Information | Search

Inside Technique : Building Multistep Forms with ASP : Multistep Demonstration Code

<FORM METHOD="post">
<%
' Always use a form post with this technique

' Store user-input in hidden fields
Dim sNextStep

' Do preprocessing if necessary to determine next step
sNextStep = "1"
select case request.form("current")
  case "1":
    ' process step 1
    ' Conditionally control the next step
    if request.form("s1_Shipping")<>"" then
      sNextStep = "2"
    else
      sNextStep = "3"
    end if
  case "2":
    sNextStep = "3"
  case "3":
    sNextStep = "4"
    ' Save user's input
  case "4":
    ' do nothing
  case default:
    sNextStep = "1"
end select

for each i in Request.Form
  if left(i,1)="s" then
    Response.write("<INPUT TYPE=hidden NAME='" & i & "' VALUE='" & Request.Form(i) & "'>")
  end if
next

Response.write("<INPUT TYPE=""hidden"" NAME=""current"" VALUE=""" & sNextStep & """>")

' Output form for next step
select case sNextStep  
  case "1": ' step 1
%>
  <TABLE CELLSPACING=0 CELLPADDING=0 BORDER=0 BGCOLOR=#EEEEEE ALIGN=CENTER>
  <TR><TH COLSPAN=2 ALIGN=CENTER>Your address</TH></TR>
  <TR><TD>Name</TD><TD><INPUT TYPE="text" NAME="s1_Name"></TD></TR>
  <TR><TD>Address<BR>City, State</TD><TD><TEXTAREA NAME="s1_haddress"></TEXTAREA></TD></TR>
  <TR><TD COLSPAN=2><INPUT TYPE=checkbox NAME="s1_Shipping"> Different Shipping Address</TD></TR>
  <TR><TD ALIGN=CENTER COLSPAN=2><INPUT TYPE=submit VALUE="Next...">
  </TABLE>
<%  case "2": ' Step 2  %>
  <TABLE CELLSPACING=0 CELLPADDING=0 BORDER=0 BGCOLOR=#EEEEEE ALIGN=CENTER>
  <TR><TH COLSPAN=2 ALIGN=CENTER>Shipping Address</TH></TR>
  <TR><TD>Address<BR>City, State</TD><TD><TEXTAREA NAME="s2_saddress"></TEXTAREA></TD></TR>
  <TR><TD ALIGN=CENTER COLSPAN=2><INPUT TYPE=submit VALUE="Next...">
  </TABLE>
<%  case "3": ' Step 3 %>
  <TABLE CELLSPACING=0 CELLPADDING=0 BORDER=0 BGCOLOR=#EEEEEE ALIGN=CENTER>
  <TR><TH COLSPAN=2 ALIGN=CENTER>Payment Information</TH></TR>
  <TR><TD>Credit Card</TD><TD>
  <INPUT TYPE=radio NAME=s3_credit VALUE=visa checked>Visa
  <INPUT TYPE=radio NAME=s3_credit VALUE=Master>MasterCard
  <INPUT TYPE=radio NAME=s3_credit VALUE=Discover>Discover
  </TD></TR>
  <TR><TD>Card Expiration</TD><TD>
  <SELECT NAME=s3_expire>
<%
      ' Generate expiration years
for i=1999 to 2007
  response.write("<OPTION VALUE=""" & i & """>" & i)
next 
%>
  </SELECT>  
  </TD></TR>
  <TR><TD ALIGN=CENTER COLSPAN=2><INPUT TYPE=submit VALUE="Next..."></TD></TR>
  </TABLE>
<%  case "4": ' Step 4%>
  <P>At this step, we would save all the user's input as shown below:<P>
  <TABLE ALIGN=CENTER BORDER><TR><TH COLSPAN=2>Information to be Saved</TH></TR>
<%
for each i in Request.Form
  if left(i,1)="s" then
    Response.write("<TR><TD>" & i & "</TD><TD>" & Request.Form(i) & "</TD></TR>")
  end if
next
response.write("</TABLE>")
end select
%>
</FORM>
Discuss and Rate this Article

Page 1:Building Multistep Forms with ASP
Page 2:Multistep Form Demonstration
Page 3:Multistep Demonstration Code