i know that there is a mailto: script to use but it is unsecure and all that, so what would be the best way to go about sending form information to an email address in javascript?

Recommended Answers

All 5 Replies

Javascript can filter all the information you need along with your form mailer. But securing those data with this script, is not advisable. Try PHP instead..

Javascript can filter all the information you need along with your form mailer. But securing those data with this script, is not advisable. Try PHP instead..

I have only been learning this kind on my own for the past month or so. How would i use PHP in it. I will put in some of what i have:

<script type="text/javascript" language="JavaScript">
//

// Function for Form F2

function checkTotal() {
document.listForm.total.value = '';
var sum = 0;
for (i=0;i<document.listForm.choice.length;i++) {
if (document.listForm.choice[i].checked) {
sum = sum + parseInt(document.listForm.choice[i].value);
}
}
document.listForm.total.value = sum;
}

</script>

</HEAD>
<BODY bgcolor="beige">

<form name="listForm">
<input type="checkbox" name="choice" value="30" onclick="javascript: checkTotal(listForm)"/> (30.00)<br>
<input type="checkbox" name="choice" value="20" onclick="javascript: checkTotal(listForm)"/> (20.00)/each<br>
<input type="checkbox" name="choice" value="0" onclick="javascript: checkTotal(listForm)"/> (free)<br>
<input type="checkbox" name="choice" value="0" onclick="javascript: checkTotal(listForm)"/> (free)<br>
<input type="checkbox" name="choice" value="12" onclick="javascript: checkTotal(listForm)"/>(free)<br>
Total: <input type="text" size="5" name="total" value="20"/>
</form>

Thank you for your help!!

Javascript can filter all the information you need along with your form mailer. But securing those data with this script, is not advisable. Try PHP instead..

i have attached the html document form that i am working with and needing to do the mailing with; it is in word doc though (but it is out of notepad originally).

Hi Matsui,

That problem is that i cannot perform actual run in PHP. I only provide solutions in which i can run first, and that's probably with JavaScript.

I'll provide you with a brief example of validating forms fields using javascript.

But im kinda busy right now, so i'll just post back later...

essential

Hi Matsui,

here's a little exercise for you, in where you can apply some experiments on the form elements using different approaches.

<?xml version="1.0" encoding="utf-8" standalone="no"?>
<?xml-stylesheet type="text/css" href="#css21" media="screen"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html id="xhtml10S" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://www.w3.org/2005/10/profile">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="Window-target" content="_top" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title>Free Live Help!</title>
<style id="css21" type="text/css" media="screen">
/* <![CDATA[ */
body { background-color : beige; }
fieldset {
  padding : 1em; }
form {
  margin : 0;
}

ul {
  list-style : none;
  margin : 1em 0 0 0;
  padding : 0; }
li {
  margin-bottom : .500em; }

/* ]]> */
</style> 
<script type="text/javascript">
// <![CDATA[
var modern = Boolean(( !!document.all === true && !!!document.getElementById ) ? 0 : 1 ); /* 
  -Checks whether the browser is IE based or not.
  -Primitive values return stricter results over the statement. */

var checkTotal = function() {
   var dom = 0;
   var eLen;
   var form; // Declare form variable
   try { // Evaluating form variable with a couple statements, so that we can make it available for all types of browser.
      dom = 1;
      form = document.listForm; // DOM form manipulation.
   } // If the try {...} statement fails, catch( error ).
   catch( e ) { // catching errors, from the try statement
   
   // OBJECT Detection
   if ( modern ) // Check if it does support the getElementById method.
      form = document.getElementById( "listForm" );
   else // referred as IE
      form = document.all.listForm;
   } // The form has been clarified.


   if ( form ) { // See if we get some result over the form. If it does, then we can start performing validations on the fields'.
      if ( dom ) { // Lets  walk the DOM.
      form.total.value = "";
      eLen = form.elements.length; // Getting all the numbers of elements inside the form.
         for ( i = 0; i < eLen; ++i ) { // loop around the entire elements.
            if ( form.elements[ i ].type === "checkbox" ) { // if the type of element belongs to checkbox group.
            form.elements[ i ].onclick = ( function() { // Installing onclick event and skipping the inline callback to your form.
              var sum = this.value * 1;
              var amount = form.total.value * 1;

// A shorthand staments
              form.total.value = (( this.checked ) ? amount + sum : amount - sum ); // if this checkbox is checked add its value to the form total, otherwise subtract it to the form "total" field.
              form.total.value = (( form.total.value * 1 ) ? form.total.value : "" ); // if current value is not equal to 0, then show the value, or show nothing.
            } ); 
            continue; // skip the incrementing procedure if the type of element is different from "checkbox" class.
            }
         } delete i; // clears up the i variable.
         return
      } alert( "To be continue!" );
   }
};
onload = checkTotal; // Initiating function.

// ]]>
</script>
</head>
<body>
<div id="main">

<form id="listForm" name="listForm" action="#">
<fieldset><legend>Test Form</legend>
<ul>
<li><label for="c0"><input type="checkbox" id="c0" name="choice" value="30" /> (30.00)</label></li>
<li><label for="c1"><input type="checkbox" id="c1" name="choice" value="20" /> (20.00)/each</label></li>
<li><label for="c2"><input type="checkbox" id="c2" name="choice" value="0" /> (free)</label></li>
<li><label for="c3"><input type="checkbox" id="c3" name="choice" value="0" /> (free)</label></li>
<li><label for="c4"><input type="checkbox" id="c4" name="choice" value="0" /> (free)</label></li>
<li><label for="total"><input type="text" id="total" name="total" value="20" size="6" maxlength="6" /> free</label></li>
</ul>
</fieldset>
</form>
</div>
</body>
</html>

sorry but i am unable to open your attached file, i can only attend on the codes that is posted here.

P.S. it's always nice to submit your form using a function, so that you can prevent the user of getting the form to be submitted with a non-validated entry, if they have turned off the javascript support on their browser. Doing it with a fuction submitted form will ensure that you wont get any spam in form mailer...

essential

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.