以编程方式填充 HTML 表单变得容易

下载源文件 - 3 Kb

引言

向网站添加“编辑”功能（即编辑注册信息、更新内容、修改购物车列表）需要构建 HTML 表单，并使用要编辑的数据填充这些表单。使用数据填充 HTML 表单最糟糕的事情之一是 HTML 和 ASP 脚本需要混合在一起。例子：

First Name: <input name="FirstName" value="<%=recSet("FirstName")%>">

这会创建非常混乱的代码，并且一旦添加了脚本，更新表单的外观和感觉会非常痛苦。

这种类型的编码存在几个问题：

• 任何设计表单的人都必须了解 ASP 脚本。
• 在添加脚本后，无法在 WYSIWYG 设计器中编辑表单。
• 由于 HTML 和脚本之间的上下文切换，服务器需要更多的处理时间。虽然所有代码都可以放在 Response.Write 函数中，但它会产生更难以管理的一团糟。
• 在表单的设计阶段，更新它所需的工作量是单独编辑 HTML 文件的许多倍。

使用一组名为 AutoForm 的函数，所有这些问题都消失了，而且甚至比以前的方式更容易……真的。

以下是基本步骤：

1. 创建一个带有表单（或多个表单）的 HTML 页面。
2. 创建一个 ASP 页面，其中包含上面表单的 #INCLUDE 语句。
3. 使用 #INCLUDE 语句添加 AutoForm.asp 函数文件。
4. 为您要填充的表单上的每个项目调用一个函数。
5. 您现在完成了！

因此，实际上，HTML 页面充当我们 ASP 页面将加载和填充的模板。不需要对 HTML 页面进行任何修改，从而允许自由更新 HTML 页面而不会干扰脚本。下面是一个 ASP 页面的示例，该页面将加载 HTML 模板页面。

  <!-- ********** Add Form Template File below ********** -->
  <!-- #INCLUDE FILE ="my_form.htm" -->
  <!-- ********** Auto Form Functions ********** -->
  <!-- #INCLUDE FILE ="autoForm.asp" -->
  
  <%' load the data into the form using the AutoForm functions
	StartAutoForm("MyForm1") ‘name of the form to load

	SetSelection "Age","30"	
	SetTextBox "FirstName", "Troy"	
	SetTextBox "LastName", "Marchand"
	SetCheckBox "Working", true
	SetRadioButton "Mood" ,"Great"	
	ClearSelection "Numbers"  'for multi-select boxes, it is a good idea to clear them first
	SetSelection "Numbers", "2"
	SetSelection "Numbers", "4"
	
	EndAutoForm()
  %>

虽然在此示例中，这些值是硬编码的，但使用记录集来填充表单同样容易。

HTML 页面上唯一的规定是表单中的每个元素都需要命名，因为所有函数都需要表单元素名称作为第一个参数。 HTML 设计师和 ASP 开发人员还必须同意使用的名称，因为它们需要在两个地方使用。

函数列表

StartAutoForm( formName)

必须在调用任何其他 AutoForm 函数之前调用。

如果需要填充多个表单，请调用此函数以设置要填充的表单。

Params

formName - 要填充的表单的名称

EndAutoForm()

在使用 AutoForm 函数填充表单后必须调用。

如果同一页面中的另一个表单需要填充，请在再次调用 StartAutoForm 之前调用此函数。

SetTextBox( fieldName, value)

填充指定的文本框。

Params

fieldName - 要填充的元素的名称 value - 要设置到字段中的值

SetSelection( fieldName, value)

在指定的选择框中选择指定的项目。

此函数可用于单选和多选样式。 如果填充多选框，则应使用 ClearSelection 以确保清除默认选择。

Params

fieldName - 要填充的选择元素的名称
value - 要选择的项目

SetRadioBuffon( fieldName, value)

在一组单选按钮中选择指定的单选按钮。

Params

fieldName - 要填充的选择元素的名称
value - 要选择的单选按钮

ClearSelection( fieldName)

清除指定选择框中的所有选择。

Params

fieldName - 要清除的选择框的名称

SetCheckBox(fieldName, bChecked)

选中或取消选中指定的复选框元素。

Params

fieldName - 要选中/取消选中的复选框的名称
bChecked - 设置为“true”以选中，或设置为“false”以取消选中