Welcome to WebmasterWorld Guest from 54.196.224.166

Forum Moderators: open

Message Too Old, No Replies

form dependency

form dependency

     

Halim

12:32 am on Oct 9, 2007 (gmt 0)

5+ Year Member



Hello all,

I have some questions.
I have a form.
One field, its asking for how many passengers.
if the users enter 5, i want the the script to automatically create 5 fields to enter the name of the passengers.

Thanks for any help

[edited by: Halim at 12:33 am (utc) on Oct. 9, 2007]

rocknbil

8:53 am on Oct 9, 2007 (gmt 0)

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Welcome aboard Halim, I will tell you how . . . if you will listen to why this is a Very Bad Idea. :-)


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
<!-- doctype all on one line, please -->
Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Populate Form with Fields</title>
</head>


<script type="text/javascript">
function populateFields() {
var f=fields='';
var p = document.getElementById('name_holder');
var num = document.getElementById('num').value;
// num == '' is only required, of course, by IE.
// REPLACE THE 's WITH PROPER VERTICAL PIPES
if ((num == '') isNaN(num)) {
p.innerHTML = '';
alert('Please enter a number for the number of passengers.');
return false;
}
// If it doesn't return, we're good, no need for an else.


for (i=0;i<num;i++) {
var f='passenger_number_'+eval(i+1); // so it's not passenger 0
fields +=
'<label for="'+f+'">Passenger '+eval(i+1)+':<\/label> '+
'<input type="text" name="'+f+'" id="'+f+'" size="25" maxlength="100" value="'+
// Remove next line for practical application
f+
'"><br>\n';
}
p.innerHTML = fields;
}
</script>


<body>
<h3>Create Fields</h3>
<p>Press &quot;Populate Names&quot; if the fields don't appear when you tab
out of the text field. &quot;f&quot; is placed in the field value for debugging.</p>
<form action="">
<label for="num">How many Passengers?</label>
<input type="text" name="num" id="num" onChange="populateFields();" size="4" maxlength="3" value="">
<input type="button" onClick="populateFields();" value="Populate Names">
<div id="name_holder"></div> <!-- id'ed container to hold the fields -->
</form>
</body>
</html>

Why this is a bad idea: This method would be Javascript-dependent. If Javascript is disabled, you have nothing for your generated fields and lose business. You are best to do this server-side as a two-page process that collects num on the first page and displays fields on the next.

Habtom

9:01 am on Oct 9, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



If Javascript is disabled, you have nothing for your generated fields and lose business.

94% of web users have javascript turned on.

In my opinion, the other 6% could be mostly people power users, if they know how to turn it off, they will probably know how to turn it back on.

Does those figures mean anything to you?

rocknbil

6:09 pm on Oct 9, 2007 (gmt 0)

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Does the Target law suit mean anything to you?

I am presuming this is a commercial website (see passengers.) It's relevant.

As a personal preference, yes, 6 percent is about 6 percent too many.

Fotiman

6:53 pm on Oct 9, 2007 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



Well put rocknbil. If you had a site with 300,000 customers per year, then you've just eliminated 18,000 of those customers because you blocked 6% of them from being able to use your site.

Don't be lazy. Do it right and then you can "enhance" it with JavaScript. Content is king. Designing a site to be dependent on JavaScript is foolish.