/    Sign up×
Community /Pin to ProfileBookmark

How to put this form in a table?

I have tried making this a table but javascript is not working. Could anybody help please?

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”
http://www.w3.org/TR/html4/strict.dtd“>
<html lang=”en”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
<meta name=”Content-Script-Type” content=”text/javascript”>
<meta name=”Content-Style-Type” content=”text/css”>
<title>Example</title>

<style type=”text/css”>
<!–
form {width:20em}
fieldset {padding:1ex}
label, button {display:block}
label {text-align:right}
select {width:8em}
button {margin:auto; margin-top:1em}
–>
</style>

<script type=”text/javascript”>
<!–
function pleaseSelect (e) {
alert ([‘Please select a value for field’, e.previousSibling.data].join (‘ ‘));
e.focus();
return false;
}

function require (e) {
if (/S/.test (e.value)) return true;
alert ([‘Please enter a value for field’, e.previousSibling.data].join (‘ ‘));
e.focus();
return false;
}

function check (f) {
switch (f.course.selectedIndex) {
case 0 :
return pleaseSelect (f.course);
break;
case 2 :
if (!require (f.vendorName) || !require (f.vendorAddress)) return false;
break;
}

switch (f.request.selectedIndex) {
case 0 :
return pleaseSelect (f.request);
break;
case 1 :
if (!require (f.id)) return false;
break;

}

return require (f.target);
}
// –>
</script>

</head>
<body>
<form action=”some-script.pl” onsubmit=”return check (this)”>
<fieldset>
<legend>Example</legend>

<label>External/Internal Course <select name=”course”>
<option>Select one</option>
<option value=”internal” selected>internal</option>
<option value=”external”>external</option>
</select></label>

<label>Request Type <select name=”request”>
<option>Select one</option>
<option value=”placeHolder” selected>Placeholder</option>
<option value=”delegate”>Delegate</option>
</select></label>

<label>ID <input name=”id” type=”text”></label>

<label>Vendor name <input name=”vendorName” type=”text”></label>

<label>Vendor address <input name=”vendorAddress” type=”text”></label>

<label>Target Date <input name=”target” type=”text”></label>

<button type=”submit”>Submit</button>
</fieldset>
</form>
</body>
</html>

Thanks

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@CharlesNov 29.2004 — [i]From the HTML 4.01 Specification:[/i]

[b]Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables.[/b]

[i] http://www.w3.org/TR/html401/struct/tables.html#h-11.1 [/i][/quote]
And the proper use of the LABEL element is extremely important. Perhaps you just need to adjust the style sheet.
×

Success!

Help @blk spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...