How to implement a form item in a dynamically added HTML document

Hello everyone, today and you talk about how to use ASP to implement dynamic Add HTML document form item problem. If you are familiar with HTML, you must know that there is a <form></form> HTML tag. There are tags (elements) between <form> and </form> such as type text, Password, Button, Submit, Reset, and so on. What we're talking about here is dynamically adding a Form item to the dynamic addition of the text element in <Form></Form>. So how do you implement dynamic add form items?

We first analyze and analyze the idea of dynamically adding a form item.

If you want to add one or more text-type form elements to your own or with HTML documents such as FrontPage, Dreamweaver, and static writing. You must have finished writing the first FORM element of type text, and then add the second form element of type text so that it will be added until the number of conditions are met. Let's not say. When you add a new type of text element, you should also display other form elements that already exist and have content and type text. The above mentioned by the static writing of HTML documents to increase the type of text form elements of the method, in fact, we are in the ASP program file dynamic add type to text form elements of the basic ideas. How do you get the content of other form elements that already exist and have content and type text? In the ASP program through the Request.Form ("Textfieldname") can be obtained. The term "textfieldname" refers to an item in <form></form> named "Textfieldname". That means <form><input type=text name=.
"Textfieldname" in the "Textfieldname" ></form>.

Now that we know how to get the contents of a form, we can use this method to get the value of a form element that already exists and has content and type text. When we show these already-valued text items, we can assign the values to the corresponding items. Next, how do we figure out how many form items have content and type text? We can get it in the following way. That is obtained by the Count property of Request.Form ("Textfieldname"). This is because in getting the form multiple type is text and has the same nameForm element, we can get a set of values and say that their values are in a set named Textfieldname. The Count property at this point is the number of similar elements in the collection, so that we can know how many of these form elements are of the type text, and you can use the Loop statement and the Count property to take out the respective values of the collection. You might ask: So how do we get the value of each element of a form named Textfieldname type text in this collection? Before we start, we define a variable I, which has an initial value of 1, and in fact this variable i is the variable we are doing in the loop. Next, we can get the value of each form element named Textfieldname with the Request.Form ("Textfieldname") (I) method. It is also important to note that when we assign the value of a form element that already has a value, type, or text to the corresponding item and display it, we should add a new form item of type text. Why, then? This is to allow us to continue to add new values. Otherwise, you won't be able to add new values until you remove all the form elements that have a value of type text, and that doesn't make the dynamic addition of the form item in the HTML document. So, you must not forget this very important point. Now we know how to get the number of elements in the form with text that satisfies the criteria, and how to get their respective values separately. So how do I control the elements of a form that just has a value and type text? And how do we end up with everything we've said? Then I'll give it the source code, and I'll add some comments or explanations in some places.
'/*dynamicaddform.asp file source code start point *
<%@ Language=vbscript%>
<%
'----------------------------------------------
' Author:waiwai (Crooked)
' Created date:2000-2-20
' File Name:DynamicAddForm.ASP
' Description:dynamic Add Form ' s Text Fields.
' All Rights Reserved. Ownership belongs to the city Club.
'----------------------------------------------
%>
<HTML>
<HEAD>
<meta name= "generator" content= "Microsoft Visual Studio 6.0" >
<title>dynamic Add Form Text elements.</title>
<style type= "Text/css" >
<!--
td {FONT-SIZE:9PT}
Body {font-size:9pt}
Select {FONT-SIZE:9PT}
A {text-decoration:none; color: #003366; font-size:9pt}
a:hover {text-decoration:underline; color: #FF0000; font-size:9pt}
-->
</style>
</HEAD>
<BODY>
<table border= "1" cellspacing= "0" height=400 width=98% bordercolorlight= "#5E5E00" bordercolordark= "#FFFFEC" Bgcolor=lightgrey Align=center valign=top>

<%
If Trim (Request.Form ("List") = "Show Existing Item" then
'/* where the trim () function is to remove Request.Form ("List") on both sides of the space * * *

'/* When you click on the button named "Show Existing Item", we will see all of the existing values of the type text form
Response.Write "<td><form><center> Existing elements content is:" & "</td><tr>"
For I = 1 to Request.Form ("items"). Count '/* Number of text types already in existence * *
Response.Write "<td align=center>" & Request.Form ("Items") (I) & "</td><tr>"
Next
If Trim (Request.Form ("NewItem")) <> "" Then
Response.Write "<td align=center>" & Trim (Request.Form ("NewItem")) Response.Write "<input Type=button Name= ' value= ' Back ' Response.Write ' style= ' font-size:12pt '/* Click on the <Back> button and return to the previous page, which is the page that adds a form item of type text */
Response.Write "</form></td><tr>"
End If
Else '/* This time indicates that the user clicked on the "Add" button to add the operation * *
Response.Write "<td align=center><form action=dynamicaddform.asp method=post></td>"
For I = 1 to Request.Form ("items"). Count
'/* The operation at this time is a loop that shows the form element with text that already exists and has a value.
'/*request.form ' ("items"). Count is the number of text types that already exist.
'/* We can add the conditional judgment of the added content here. If you want to determine whether the added content is less than 3 of the length. * *
Response.Write "<td align=center><input type=text name=items value= '"
Response.Write Request.Form ("items") (I) & "' ></td><tr>"
'/* This step is to display the value of a form element with a value of type text.
Next
If Trim (Request.Form ("NewItem")) <> "" Then
'/* The purpose of this step is to check whether the user adds a new value to the form element that adds a new type of text.
'/* There is a FORM element that assigns this value to the Name=items type text and is displayed. */
Response.Write "<td align=center><input type=text name=items value= '"
Response.Write Trim (Request.Form ("NewItem")) & "'"
Response.Write "><br></td><tr>"
Response.Write "<td align=center><input type=text Name=newitem" Response.Write "value=" ></td>< Tr> "
'/* Here is to add a form element named NewItem type text, so that the user can continue adding operations. */
Else
'/* This indicates that the user has not added a new value when adding a new form element of type text, so you can only list the */
'/* A FORM element named NewItem type is text that allows the user to continue adding operations. */
Response.Write "<td align=center><input type=text name=newitem value= ' ></td>"
End If
%>
&LT;TR&GT;&LT;TD align=center><br>
<input type=submit name= "List" value= "Show Existing Items" style= "font-size:12pt" >
<input type=submit name= "Add" value= "adding" style= "font-size:12pt" >
</form>
</td>
<%
End If
%>
</table>
</BODY>
</HTML>
'/*dynamicaddform.asp file source code end point *

After you look at the source code, you may notice that there are two form item elements of type text: One name is items and one name is NewItem. Why, then? This is because we want to differentiate between what users get by clicking < adding > buttons, and when they have entered a new value, which is a form element that we have in order for the user to have a place to enter the new value for type text. This way we can make it very clear that only a form item element that the user has added, with a value of type text, is listed in the loop. That's why we name them different names, isn't it wonderful? Oh:-). In fact, the key to this approach is to take advantage of the Request.Form ("Textfieldname") of the Count property and Request.Form ("Textfieldname") (I) method, That makes it easier for us to get the number of form item elements named Textfieldname and the values to get them, respectively. These two methods are of great use and can greatly simplify the code we are writing. You must remember both of these usages. Below I give a no use of these two uses of ASP program source code, we compare, experience why the above code is better.

'/*dynamicaddform2.asp file source code start point *
<%@ Language=vbscript%>
<%
'----------------------------------------------------
' Author:waiwai (Crooked)
' Created DATE:2000/1/13
' File Name:DynamicAddForm.ASP
' Description:dynamic Add Form ' s Text Fields.
' All Rights Reserved. Ownership belongs to City Club
'----------------------------------------------------
%>
<HTML>
<HEAD>
<meta name= "generator" content= "Microsoft Visual Studio 6.0" >
</HEAD>
<style type= "Text/css" >
<!--
td {FONT-SIZE:9PT}
Body {font-size:9pt}
Select {FONT-SIZE:9PT}
A {text-decoration:none; color: #003366; font-size:9pt}
a:hover {text-decoration:underline; color: #FF0000; font-size:9pt}
-->
</style>
<title>add New mail server site. All Rights reserved.</title>
<script language=javascript>
function MyCheck (TT) {
Alert ("AfD")
return False
}
</script>
<body topmargin=12>
<form Name=form1 method=post>
<table border= "1" cellspacing= "0" height=400 width=98% bordercolorlight= "#5E5E00" bordercolordark= "#FFFFEC" Bgcolor=lightgrey Align=center valign=top>
&LT;TD align=center colspan=5 valign=top height=30>
</td><tr>
&LT;TD align=center valign=top height=10><font style= "font-size:11pt" > Number </font></td>
&LT;TD align=center valign=top height=10 width=43%><font style= "font-size:11pt" > Mail server url</font></ Td>
&LT;TD align=center valign=top height=20 width=17%><font style= "font-size:11pt" > Username parameter variable </font></ Td>
&LT;TD align=center valign=top height=20 width=17%><font style= "font-size:11pt" > Password parameter variable </font></td >
&LT;TD align=center valign=top height=20 width=17%><font style= "font-size:11pt" > site name </font></td >
<tr>
&LT;TD colspan=5 valign=top height=30>
<font color=blue>[* * * * Example: * * * *]<br>
0.990.net/prog/login?

User


Pass 990.net
</font>
</td>
<tr>
<%
If Trim (request.form ("num") = "" Then
'/* This means that the user opens the ASP page for the first time, so the resulting num is empty and the corresponding input interface is displayed for the user to enter information
' The NUM value is to record the number of form elements of type text, with the ' Request.Form ' (' Items ') in the first code file. Count effect. * *
'/*first time Open this page.*/
Response.Write "<td align=center valign=top>1.</td>"
Response.Write "<input Type=hidden name=num value=1>"
Response.Write "<td align=center valign=top >"
Response.Write "<input type=text size=40 name=url1></td>"
Response.Write "<td align=center valign=top > <input type=text size=12 id=text1 name=user_var1></td>" & vbCrLf
Response.Write "<td align=center valign=top > <input type=text size=12 id=text2 name=pw_var1></td>"
Response.Write "<td align=center valign=top > <input type=text size=12 id=text2 name=sitename1></td>& Lt;tr> "
Else
'/*add new*/
' Response.Write ' <td align=center valign=top> & Trim (request.form ("num")) & ".</td>"
'/*loop start*/
Response.Write "<td colspan=5 valign=top>"
For I = 1 to CInt (Trim (request.form ("num")) +1
%>
<%=i%>.
<%if I<10 Then
'/* The purpose here is to ensure that the first 10 elements are indented the same width as the last 89 elements */%>

<%elseif i<100 and I>9 then%>

<%end if%>
<%if I<>cint (Trim (request.form ("num")) +1 Then
Url= "url" & I '/* generate such as url1,url2 ... The String * *
User_var = "User_var" & I
Pw_var = "Pw_var" & I
SiteName = "SiteName" & I
If Trim (Request.Form (URL)) <> "" and Trim (Request.Form (User_var)) <> "" And_ Trim (Request.Form (Pw_var)) < > "" and Trim (Request.Form (sitename)) <> "" Then%>
<input type=text size=40 name=<%=url%> value=<%=trim (request.form (URL))%>>
<input type=text size=12 id=text1 name=<%=user_var%> Value=<%=trim (Request.Form (User_var))%>>
<input type=text size=12 id=text2 name=<%=pw_var%> Value=<%=trim (Request.Form (Pw_var))%>>
<input type=text size=12 id=text2 name=<%=sitename%> Value=<%=trim (Request.Form (sitename))%>>
<br>
<% Else
%>
<script>
Alert ("Mail server URL, username parameter variable, password parameter variable, site name has null value!") ")
Window.history.back ()
</script>
<% Exit For
End If
Else%>
<input Type=text size=40 name=url<%=i%>>

<input type=text size=12 id=text1 name=user_var<%=i%>>

<input type=text size=12 id=text2 name=pw_var<%=i%>>
<input type=text size=12 id=text2 name=sitename<%=i%>>
<br>
<%end if
Next
'/*loop end*/
End If
%>
</td>
<tr>
&LT;TD colspan=5 Align=center height=20>
<input Type=button value= "append" style= "font-size:11pt"
>
<input Type=button value= "Save" style= "font-size:11pt"
>

<input Type=button value= "Back to Console" style= "font-size:11pt"
>
</td>
</table>
<%if Trim (request.form ("num")) <> "" Then
'//* Start recording the number of text type elements when you start adding values to the first FORM element of type text */%>
<input type=hidden name=num value=<%=cint (Trim (request.form ("num")) +1%>>
<%end if%>
</form>
</BODY>
</HTML>
'/*dynamicaddform2.asp file source code end point *

Now everyone has seen the two methods to implement the program source code. What do you have in mind? Oh, do not think the first program code is more concise than the second program code. We used the Count property of Request.Form ("Textfieldname") to count the number of such form elements so far in the first program code when we got the value of the form element with the same name type text. In the second program code, we save and get this number through the elements of the <form></form> type hidden. It is also worth mentioning that the names of these form elements of type text are named the same name. This avoids the part of the second program code, such as "Url=" url "& I". Of course, the idea is to know that the Request.Form ("Textfieldname") has the attribute of Count this is the premise of the idea. So the advantage of the first program code is that it takes advantage of the use of the Count property and the value when getting the value of the same type of form element with the same name. Well, the best way to solve the problem is based on a good understanding of the tools used. The key to all of this is that we have to do it constantly so that we can better understand, learn, and have better ways.