homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

form dependency
form dependency

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

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]



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

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

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

<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.
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
p.innerHTML = fields;

<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 -->

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.


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

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?


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

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.


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

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.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved