Inserting Select List Options

twilitegxa · August 28, 2009

I have the following code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>E-Mail Form</title>
<link rel="stylesheet" href="js_styles.css" type="text/css" />
<meta http-equiv="content-type"
content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
/* <![CDATA{ */
function validateSubmission() {
var retValue = true;

if (document.forms[0].subject.value.length > 40) {
    window.alert("The subject must be 40 characters or less!");
    return false;
}

else if (document.forms[0].sender_email.value == "" || document.forms[0].recipient_email.value == "" || document.forms[0].subject.value == "") {
window.alert("You did not fill in one of the following required fields: sender e-mail, recipient e-mail, or subject.");
retValue = false;
}

if (retValue == false)
    return retValue;
retValue = validateEmail(document.forms[0].sender_email);
if (retValue == false)
    return retValue;
    
/*retValue = validateEmail(document.forms[0].recipient_email);
if (retValue == false)
    return retValue;*/
/*retValue = compareAddresses(document.forms[0].sender_email, document.forms[0].recipient_email);
return retValue;*/

}

function validateEmail(formObject) {
    var email = formObject.value;
    if (email.search(/@/) == -1 || email.lastIndexOf(".") == -1) {
        window.alert("One or more of the e-mail addresses you entered does not appear to be valid.");
        return false;
    }
    formObject.value = email.toLowerCase();
    return true;
}

/*function compareAddresses(senderObject, recipientObject) {
    var senderEmail = senderObject.value;
    var recipientEmail = recipientObject.value;
    senderEmail = senderEmail.toLowerCase();
    recipientEmail = recipientEmail.toLowerCase();
    if (senderEmail.localeCompare(recipientEmail) == 0) {
        window.alert("You entered the same e-mail address for sender and recipient.");
    return false;
}
else
    return true;
}*/

function addRecipient() {
    if (document.forms[0].recipient_name.value == "" || document.forms[0].recipient_email.value == "")
        window.alert("You must enter the recipient's name and e-mail address.");
        
    else {
        retValue = validateEmail(
        document.forms[0].recipient_email);
        if (retValue ==  false)
        return retValue;
        if (document.forms[0].recipients.options[0] && document.forms[0].recipients.options[0].value == "recipients")
        document.forms[0].recipients.options[0] = null;
        var nextRecipient = document.forms[0].recipients.options.length;
        var createRecipient = new Option (document.forms[0].recipient_name.value + ", " + document.forms[0].recipient_email.value);
        document.forms[0].recipients.options[nextRecipient] = createRecipient;
        var recipientsArray = new Array();
        for (var i=0; i<document.forms[0].recipients.options.length; ++i) {
            recipientsArray.push(document.forms[0].recipients.options[i].value);
        }
        for (var j=0; j<recipientsArray.length; ++j) {
            var createRecipient = new Option(recipientsArray[j]);
            document.forms[0].recipients.options[j] = createRecipient;
        }
        }
        
    }
function deleteRecipient() {
var selectedIndex = document.forms[0].recipients.selectedIndex;
var recipientInfo = document.forms[0].recipients.options[selectedIndex] = null;
}
/* ]]> */
</script>
</head>
<body>
<form action="FormProcessor.html" method="get" onsubmit="return validateSubmission()">
<table frame="border" rules="cols" >
<tr>
<td valign="top">
<h2>Sender</h2>
<p>Name<br />
<input type="text" name="sender_name" size="40" /></p>
<p>E-Mail Address<br />
<input type="text" name="sender_email" size="40" /></p>
<hr /><h2>Recipients</h2>
<p>Name<br />
<input type="text" name="recipient_name" size="40" /></p>
<p>E-Mail Address<br />
<input type="text" name="recipient_email" size="40" /></p>
<p><input type="button" value="Add" onclick="addRecipient()"  />  <input type="button" value="Remove" onclick="deleteRecipient()"  />  <input type="button" value="Update" onclick="updateSelectedRecipient()"  /></p>
<select name="recipients" size="4" style="width: 265px" onclick="getRecipientInfo()">
<option value="recipients">Recipients</option>
</select>
</td>
<td valign="top">
<h2>Message Details</h2>
<p>Subject<br />
<input type="text" name="subject" size="53" /></p>
<p>Message<br />
<textarea name="message" rows="14" cols="40"></textarea></p>
<p style="text-align: center"><input type="submit" value="Send" /><input type="reset" />
<input type="hidden" name="recipientsList" /></p>
</td></tr>
</table>
</form>
</body>
</html>

And here is the page that is displaying the results of the form:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Form Processor</title>
<meta http-equiv="content-type" content="text/html;
charset=iso-8859-1" />
<link rel="stylesheet" href="js_styles.css" type="text/css" />
</head>
<body>
<script type="text/javascript">
/* <![CDATA[ */
document.write("<h1>Your form has been submitted!</h1><h2>You entered the following data:</h2>");
var formData = location.search;
formData = formData.substring(1, formData.length);
while (formData.indexOf("+") != -1) {
    formData = formData.replace("+", " ");
}
formData = unescape(formData);
var formArray = formData.split("&");
for (var i=0; i < formArray.length; ++i) {
    document.writeln(formArray[i] + "<br />");
}
/* ]]> */
</script>
</body>
</html>

How can I insert the results being generated into the select list into my table in my database?

twilitegxa · August 28, 2009

I tried adding this to the page that displays the form results, but nothing is getting inserted into my table. What am I doing wrong? I changed the form method to post instead of get as well, and it isn't working. :-(

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Form Processor</title>
<meta http-equiv="content-type" content="text/html;
charset=iso-8859-1" />
<link rel="stylesheet" href="js_styles.css" type="text/css" />
</head>
<body>

<script type="text/javascript">
/* <![CDATA[ */
document.write("<h1>Your form has been submitted!</h1><h2>You entered the following data:</h2>");
var formData = location.search;
formData = formData.substring(1, formData.length);
while (formData.indexOf("+") != -1) {
    formData = formData.replace("+", " ");
}
formData = unescape(formData);
var formArray = formData.split("&");
for (var i=0; i < formArray.length; ++i) {
    document.writeln(formArray[i] + "<br />");
}
/* ]]> */
</script>

<?php 
//connect to server and select database
$conn = mysql_connect("localhost", "root", "")
    or die(mysql_error());
$db = mysql_select_db("smrpg", $conn) or die(mysql_error());

$insert_email = "insert into testemail values ('$_POST[sender_name]', '$_POST[sender_email]', '$_POST[recipient_name]', '$_POST[recipient_email]', '$_POST[recipients]', '$_POST[subject]', '$_POST[message]')";
mysql_query($insert_email, $conn) or die(mysql_error());

?>

</body>
</html>

Sign In

Inserting Select List Options

Recommended Posts

twilitegxa

Link to comment

Share on other sites

twilitegxa

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information