/    Sign up×
Community /Pin to ProfileBookmark

making fields mandatory

Copy linkTweet thisAlerts:
Nov 11.2004

I have a javascript as follows.

<html>
<head>
<title>Training Request Form</title>

</head>
<body bgcolor=”white” link=”#3333FF” vlink=”#006600″>

<form action=”” METHOD= POST>

<br>
<br>
<table BORDER=1 CELLSPACING=0 CELLPADDING=0 >
<tr>
<td ALIGN=LEFT><b><font size=-1 face=”Arial”>External/Internal Course:</font></b></td>

<td><select NAME=”type1″>
<option></option>
<option value=”choose” SELECTED>select</option>
<option value=”internal”>internal</option>
<option value=”external”>external</option>
</td>

</tr>

<tr>
<td ALIGN=LEFT><b><font size=-1 face=”Arial”>Request Type:</font></b></td>

<td><select NAME=”type2″>
<option></option>
<option value=”choose” SELECTED>select</option>
<option value=”placeholder”>Placeholder</option>
<option value=”delegate”>Delegate</option>
</td>

</tr>

<tr>
<td ALIGN=LEFT><b><font size=-1 face=”Arial”>ID:</font></b></td>

<td><input NAME=”id” SIZE=40 MAXLENGTH=55 ></td>

</tr>

<tr>
<td ALIGN=LEFT><b><font size=-1 face=”Arial”>Vendor Name:</font></b></td>

<td><input NAME=”vendorname” SIZE=40 MAXLENGTH=55 ></td>
<td ALIGN=LEFT><b><font size=-1 face=”Arial”>Address:</font></b></td>

<td><input NAME=”address” SIZE=40 MAXLENGTH=55 ></td>

</tr>

<tr>
<td ALIGN=LEFT><b><font size=-1 face=”Arial”>Target Date:</font></b></td>

<td><input NAME=”targetdate” SIZE=40 MAXLENGTH=55 ></td>

</table>
<p><input type=submit value=Submit>&nbsp;
<INPUT type=reset value=”Clear Form”></p>

</form>

</body>
</html>

In the above script, field ‘internal/external’is mandatory. if ‘external’ is selected, ‘Vendor Name’ and ‘Address’ become mandatory. If ‘internal’ is selected, ‘Vendorname’ and ‘Address’ are optional.

field ‘Request type’ is mandatory. If ‘placehlder’ is selected, filed ‘ID’ becomes mandatory. If ‘Delegates’ is selected, ‘ID’ is optional.

field ‘target date’ is mandatory.

Could anyone help me in writing this code please.

Thanks very much

to post a comment
JavaScript

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@CharlesNov 11.2004 — I'm off to go do some real work and I get back to this later, but in the mean time get that to pass [url=http://validator.w3.org/]The Validator[/url].
Copy linkTweet thisAlerts:
@CharlesNov 11.2004 — [font=monospace]<!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">internal</option>

<option value="external">external</option>

</select></label>

<label>Request Type <select name="request">

<option>Select one</option>

<option value="placeHolder">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>[/font]
Copy linkTweet thisAlerts:
@blkauthorNov 12.2004 — Thank you so much Charles!

Just a small change.

'Internal' is the default.

'Placeholder' is the default.

Could you change the code accordingly please!
×

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 5.27,
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: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

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

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...