Hi,
I need to build a user form which allows the input of certain figures. The form will be split into 3 sections, and I want each section to be accessible by clicking on the headings and the input places then appear below. I want to use tables to line everything up.
Below is what I want it to look like.
[-]Financials
Sales [then a drop-down select menu here, and then 2 other text input fields on the same row]
Revenue [then a drop-down select menu here, and then 2 other text input fields on the same row]
[+]Employees
[+]Headquarter details
Someone produced the following example for me using SPAN and DIV tags:
<HTML>
<HEAD>
<TITLE>Collpsible</TITLE>
<STYLE>
SPAN {font-size: 18pt; cursor: hand}
.on {display: on}
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
// Set bSupportsDHTML to true for Internet Explorer 4 or later.
var bDoesDHTML = ( (navigator.userAgent.indexOf("MSIE"
>= 0) &&
(navigator.appVersion.substring(0,1) >= 4) )
// Only hide menu items if browser supports DHTML.
if(bDoesDHTML){document.write("<STYLE>.off{display:none}</STYLE>"}
function doSect(secNum){
if (bDoesDHTML){
//display the section if hidden; hide it if it is displayed
if (secNum.className=="off"{secNum.className="on"}
else{secNum.className="off"}
}
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<SPAN onclick="doSect(Test)"><B>Main Chapter</B></SPAN><BR>
<DIV CLASS="off" ID="Test">
<A HREF="some.htm">Chapter 1</A><BR>
<A HREF="some.htm">Chapter 2</A><BR>
<A HREF="some.htm">Chapter 3</A><BR>
<A HREF="some.htm">Chapter 4</A><BR>
</DIV>
</BODY>
</HTML>
This works and I tried to implement it into a small example of mine below, without success!!
<html>
<head>
<title>Example Menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<FORM ACTION="page2d.asp" METHOD="post" NAME="main1">
<table width="100%" border="0">
<tr>
<td width="8%" height="54" colspan="6">
<SPAN onclick="doSect(Test)"><b> Main Menu </b></SPAN>
</td>
</tr>
<tr>
<td width="8%" height="54"> <DIV CLASS="off" ID="Test">
<font face="Times New Roman, Times, serif" size="2"><b> Market Size </b></font><BR>
</td>
<td width="12%">
<font face="Times New Roman, Times, serif" size="2"><b>
<select name="mkt_cap" onChange="check2(this.form.mkt_cap, this.form.mkt_min, this.form.mkt_max)">
<option value="A">Any</option>
<option value="1">£0-500m</option>
<option value="2">£500m-£1bn</option>
<option value="3">£1bn+</option>
</select>
</b></font></td>
<td width="4%"><b><font face="Times New Roman, Times, serif" size="2">OR</font></b></td>
<td width="22%"> <font face="Times New Roman, Times, serif" size="2"><b>Min:
<input type="text" name="mkt_min" maxlength="6" size="15" onChange="checkdata(this.form.mkt_cap, this.form.mkt_min)">
million </b></font></td>
<td width="22%"> <font face="Times New Roman, Times, serif" size="2"><b>Max:
<input type="text" name="mkt_max" maxlength="6" size="15" onChange="checkdata(this.form.mkt_cap, this.form.mkt_max)">
million </b></font></td>
</DIV>
</tr>
</table>
</form>
</body>
</html>
The closing div tag doesn't seem to work. Have I just placed the Div tags in the wrong positions???
Cheers for any help at all.
I need to build a user form which allows the input of certain figures. The form will be split into 3 sections, and I want each section to be accessible by clicking on the headings and the input places then appear below. I want to use tables to line everything up.
Below is what I want it to look like.
[-]Financials
Sales [then a drop-down select menu here, and then 2 other text input fields on the same row]
Revenue [then a drop-down select menu here, and then 2 other text input fields on the same row]
[+]Employees
[+]Headquarter details
Someone produced the following example for me using SPAN and DIV tags:
<HTML>
<HEAD>
<TITLE>Collpsible</TITLE>
<STYLE>
SPAN {font-size: 18pt; cursor: hand}
.on {display: on}
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
// Set bSupportsDHTML to true for Internet Explorer 4 or later.
var bDoesDHTML = ( (navigator.userAgent.indexOf("MSIE"
>= 0) &&(navigator.appVersion.substring(0,1) >= 4) )
// Only hide menu items if browser supports DHTML.
if(bDoesDHTML){document.write("<STYLE>.off{display:none}</STYLE>"
}function doSect(secNum){
if (bDoesDHTML){
//display the section if hidden; hide it if it is displayed
if (secNum.className=="off"
{secNum.className="on"} else{secNum.className="off"}
}
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<SPAN onclick="doSect(Test)"><B>Main Chapter</B></SPAN><BR>
<DIV CLASS="off" ID="Test">
<A HREF="some.htm">Chapter 1</A><BR>
<A HREF="some.htm">Chapter 2</A><BR>
<A HREF="some.htm">Chapter 3</A><BR>
<A HREF="some.htm">Chapter 4</A><BR>
</DIV>
</BODY>
</HTML>
This works and I tried to implement it into a small example of mine below, without success!!
<html>
<head>
<title>Example Menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<FORM ACTION="page2d.asp" METHOD="post" NAME="main1">
<table width="100%" border="0">
<tr>
<td width="8%" height="54" colspan="6">
<SPAN onclick="doSect(Test)"><b> Main Menu </b></SPAN>
</td>
</tr>
<tr>
<td width="8%" height="54"> <DIV CLASS="off" ID="Test">
<font face="Times New Roman, Times, serif" size="2"><b> Market Size </b></font><BR>
</td>
<td width="12%">
<font face="Times New Roman, Times, serif" size="2"><b>
<select name="mkt_cap" onChange="check2(this.form.mkt_cap, this.form.mkt_min, this.form.mkt_max)">
<option value="A">Any</option>
<option value="1">£0-500m</option>
<option value="2">£500m-£1bn</option>
<option value="3">£1bn+</option>
</select>
</b></font></td>
<td width="4%"><b><font face="Times New Roman, Times, serif" size="2">OR</font></b></td>
<td width="22%"> <font face="Times New Roman, Times, serif" size="2"><b>Min:
<input type="text" name="mkt_min" maxlength="6" size="15" onChange="checkdata(this.form.mkt_cap, this.form.mkt_min)">
million </b></font></td>
<td width="22%"> <font face="Times New Roman, Times, serif" size="2"><b>Max:
<input type="text" name="mkt_max" maxlength="6" size="15" onChange="checkdata(this.form.mkt_cap, this.form.mkt_max)">
million </b></font></td>
</DIV>
</tr>
</table>
</form>
</body>
</html>
The closing div tag doesn't seem to work. Have I just placed the Div tags in the wrong positions???
Cheers for any help at all.