Hi I am quite the amateur in coding but... I'm trying. I have this form (html): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Website</title> <style type="text/css"> </style> </head> <body> <form action="/html_form_send.php" method="post" name="htmlform" id="htmlform"> <p> </p> <table width="491" height="424" align="center"> <td width="236" valign="top" bgcolor="#FFB511" class="body"><label for="first_name">First Name*</label></td> <td width="202" valign="top" bgcolor="#FFB511"><input type="text" name="first_name" maxlength="50" size="30" /></td> </tr> <tr> <td valign="top" bgcolor="#FFA60A" class="body""><label for="website">Website Url*</label></td> <td valign="top" bgcolor="#FFA60A"><input type="text" name="website" maxlength="50" size="30" /></td> </tr> <tr> <td valign="top" bgcolor="#FD9E06" class="body""><label for="website_title">Website Title*</label></td> <td valign="top" bgcolor="#FD9E06"><input type="text" name="website_title" maxlength="50" size="30" /></td> </tr> <tr> <td valign="top" bgcolor="#FF9505"><span class="body"><label for="email">Email Address* </label></span></td> <td valign="top" bgcolor="#FF9505"><input type="text" name="email" maxlength="80" size="30" /></td> </tr> <td valign="top" bgcolor="#FE9005" class="body"><label for="webpage">Desired Webpage*</label></td> <td valign="top" bgcolor="#FE9005"><textarea name="webpage" cols="30" rows="2" placeholder='Kidawa.com/' /></textarea></td> </tr> <tr> <td valign="top" bgcolor="#FE7503" class="body"><label for="comments">Questions</label></td> <td valign="top" bgcolor="#FF8402"><textarea name="comments" cols="30" rows="9"></textarea></td> </tr> <tr> <td colspan="2" bgcolor="#FF6505" style="text-align:center; font-size: 14px;"><p> <input type="submit" value="Submit" /> <br /> </p></td> </tr> </table></form> </td> <td> </td></tr></table> <table cellpadding="0" cellspacing="0"> </table> </body> </html> Here is the corresponding PHP: <?php if(isset($_POST['email'])) { $email_to = "support@website.com"; $email_subject = "New Sign Up"; function died($error) { // your error code can go here echo "We are very sorry, but there were error(s) found with the form you submitted. "; echo "These errors appear below.<br /><br />"; echo $error."<br /><br />"; echo "Please go back and fix these errors.<br /><br />"; die(); } // validation expected data exists if(!isset($_POST['first_name']) || !isset($_POST['email'])) { died('We are sorry, but there appears to be a problem with the form you submitted.'); } $first_name = $_POST['first_name']; // required $email_from = $_POST['email']; // required $error_message = ""; $email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/'; if(!preg_match($email_exp,$email_from)) { $error_message .= 'The Email Address you entered does not appear to be valid.<br />'; } $string_exp = "/^[A-Za-z .'-]+$/"; if(!preg_match($string_exp,$first_name)) { $error_message .= 'The First Name you entered does not appear to be valid.<br />'; } $email_message = "Form details below.\n\n"; function clean_string($string) { $bad = array("content-type","bcc:","to:","cc:","href"); return str_replace($bad,"",$string); } $email_message .= "First Name: ".clean_string($first_name)."\n"; $email_message .= "Email: ".clean_string($email_from)."\n"; // create email headers $headers = 'From: '.$email_from."\r\n". 'Reply-To: '.$email_from."\r\n" . 'X-Mailer: PHP/' . phpversion(); @mail($email_to, $email_subject, $email_message, $headers); ?> Thank you for contacting us. We will be in touch with you very soon. <?php } die(); ?> This form works! But I want to add in a drop list with multiple levels. It needs to be required and only a single option can be selected. Unless you have a good example you can work into this Form i was looking at the following code that is located at: http://forums.digitalpoint.com/showthread.php?t=703846 Can someone please help me incorporate these dropdown lists into my Form? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <title></title> <script type="text/javascript"> var makes = new Array("BMW", "Ford"); var models = new Array(); models["BMW"] = new Array("318", "525", "650", "X5"); models["Ford"] = new Array("Bronco", "Explorer", "Focus"); function resetForm(theForm) { /* reset makes */ theForm.makes.options[0] = new Option("Please select a make", ""); for (var i=0; i<makes.length; i++) { theForm.makes.options[i+1] = new Option(makes, makes); } theForm.makes.options[0].selected = true; /* reset models */ theForm.models.options[0] = new Option("Please select a model", ""); theForm.models.options[0].selected = true; } function updateModels(theForm) { var make = theForm.makes.options[theForm.makes.options.selectedIndex].value; var newModels = models[make]; theForm.models.options.length = 0; theForm.models.options[0] = new Option("Please select a model", ""); for (var i=0; i<newModels.length; i++) { theForm.models.options[i+1] = new Option(newModels, newModels); } theForm.models.options[0].selected = true; } </script> </head> <body> <form name="autoSelectForm" action="" method="post"> <select size="1" name="makes" onchange="updateModels(this.form)"> </select> <select size="1" name="models"> </select> <input type="submit"> </form> <script type="text/javascript"> resetForm(document.autoSelectForm); </script> <?php $make = $_POST['makes']; $model = $_POST['models']; if ($make && $model) { echo "<p>".$make." - ".$model."</p>"; } ?> </body> </html> Any help HIGHLY appreciated.
Uhm... where are your OPTION tags that go inside those SELECT? Are you only generating them via javascript? (and therein inaccessibly). You seem to be using a mix of old-fashioned netscape 4 style form handling and modern DOM -- which don't tend to mix well if at all... your method of passing "theform" is inflexible and unreliable, much less in modern code hooks should not be in the markup. Basically you need to: 1) swing an axe at trying to access things by 'name' and use getElementById instead. 2) stop trying to play with 'length' on the SELECT and instead empty it out by looping firstchild. 3) build those new select with the DOM instead of indexing an unset array.' 4) add a plan for when javascript is unavailable or intentionally blocked, since a LOT of people block scripting these days. Really if you can't build the form working without javascript, you probably shouldn't be building a form. Scripting should enhance your form, not replace it's functionality. Of course that's only the tip of the iceberg for 'problems' with your code, with the lack of ID's on every form element, lack of labels, labels 'for' attribute having no targets (since they point at ID's, not NAME's), tables for layout... and whole host of other 1990's style coding. Though the first line of your first example proudly proclaims that to all the world -- since a tranny doctype means you are in 'transition' from 1997 to 1998 coding practices.
deathshadow Thanks a lot for the reply. I did not design those drop down lists, rather I just found them in another post that I shared the link to in my first post. I had difficulty understanding it myself hence finally I came here. Please disregard the list code above. I would totally rather stay away from java for the drop downs. This is what I would like more: <FORM action="http://somesite.com/prog/someprog" method="post"> <P> <SELECT name="Sites"> <OPTION selected label="none" value="none">None</OPTION> <OPTGROUP label="Business"> <OPTION label="3.7.1" value="pm3_3.7.1">Internet</OPTION> <OPTION label="3.7" value="pm3_3.7">Industrial</OPTION> <OPTION label="3.5" value="pm3_3.5">Real Estate</OPTION> </OPTGROUP> <OPTGROUP label="Art"> <OPTION label="3.7" value="pm2_3.7">Painting</OPTION> <OPTION label="3.5" value="pm2_3.5">Drawing</OPTION> </OPTGROUP> <OPTGROUP label="News"> <OPTION label="3.7R" value="IRX_3.7R">Sports</OPTION> <OPTION label="3.5R" value="IRX_3.5R">World</OPTION> </OPTGROUP> </SELECT> </FORM> </div> <div id="footer"></div> </div> Instead of the options staying in the same list, is there a way to let the optgroups open a cascade list. Basically all I want is a menu with submenus for the form and help on getting it all to work.