Hi All, I’m just starting up in web design and I have an interesting challenge that I’m hoping can be solved w/java script. I have a site with an application form. When the form is to be submitted, the form data needs to be emailed to the correct person to handle that particular application. However, that can’t be determined by anything specific in the form. It can only be determined by the link that they clicked on to get to the form. I really don’t want to have 22 identical forms with just a different EmailTo addie, which is what the previous site developer did. Someone please tell me this can be done w/java script? If not w/java script, what can I look into to solve this?
Actually, there will be more than 22 links to the html page that will have the form. This is for an animal rescue website, so each animal’s bio will have a link to the person that will handle the application for that animal. One person can have several animals listed. I don’t actually have those pages written, yet. I like to plan ahead–I’m a C programmer just now learning this web stuff.
Below is the html from the test page that calls the app that I’m working on. There will actually be one page for each animal, with pics and a description of the animal. The AdoptionApp.html has the same header, then the form, nothing else.
<!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 content=“text/html; charset=ISO-8859-1”
http-equiv=“content-type” />
<title> AvailableDogs</title>
<meta content=“Transitions” name=“author” />
<meta content=“Available Animals”
name=“description” />
<link rel=“stylesheet” type=“text/css” href=“RescueSite.css” />
</head>
<body>
<h1>
<b>Animal Shelter</b>
</h1>
<p style=“text-align: center; font-size: 140%;”>=“”><br />
Available Dogs</p>
<br />
<p> . If you are interested in adopting this animal, please fill out the <a href=“AdoptionApp.html”>
adoption application.</a> Someone will get in touch with you within a few days to discuss your application.</p>
</body>
</html>
Although it can all be done with javascript, my recommendation would be to set up the form and mail process using a server side scripting language like PHP, ASP etc.
If using PHP you could do something similar to this:
in the page you posted append the email recipient’s name to the url of the link to the form.
in AdoptionApp.php set up your mail form to include the following
<form action="sendEmail.php" method="post">
<input type="hidden" name="txtEmailRecip" value="<?php echo $_POST['txtName']; ?>" />
<!--
add other form input fields like first name, last name etc etc
-->
<input type="submit" value="Send email" />
</form>
in sendEmail.php
Set up an associative array with the email recipients’ names as the key and their email addresses as values.
Get the value from the email address array for the key $_POST[‘txtEmailRecip’].
Use php’s mail() function to email the information collected in the form in 2) to the above email address.
Using a server side script to handle the form and email sending means you don’t have to use the mailto: attribute in a <form> which would require the user to have an email program installed on their pc and you won’t have to use javascript for which you would need a Plan B for those with javascript turned off in their browsers for whatever reason.
