Submit form on website

duderoo

duderoo

Expert Member
Joined
Jun 7, 2005
Messages
3,375
Reaction score
241
Location
Earth
That tutorial just covers the front end of the form - you would still need php or similar on the server to process the form and execute whatever action you require. Here is a similar tutorial which includes example php scripts.

Or, you might want to have a look at wufoo which does all of that for you.
 
chiskop....how does it work with submitting the form, does it use the mail settings from your hosting company?
 
Hey there Duderoo

1. The best simply method is to create a form that stores it in your web site database. Then is easy to access it by downloading the database with the updated information.

2. Too make life even easier then try MyList Manager* Has forms which fills in data you like but its actually meant for mailing purpose but heard lot people use it to get information of they clients.

3. As mention about mailing to your inbox , You need to know simple PHP.


*Link on MyBB
 
duderoo, where are you hosting your form and what scripting options are available to you?

I'll be able to assist with the above info.
 
server-admins.net said:
duderoo, where are you hosting your form and what scripting options are available to you?

I'll be able to assist with the above info.
Click to expand...

Hi, well my website is hosted with texo, so can I assume thats where the form will be hosted?

I think all options are available.

thanks
 
duderoo said:
Hi, well my website is hosted with texo, so can I assume thats where the form will be hosted?

I think all options are available.

thanks
Click to expand...
Do you have ASP support?
If so try this

The form assumes the following :
You are submitting the following fields
email
comments
Code: 
<%
email = request("email")
comments = request("comments")
Dim sHTMLBody 
Dim objMail 
Set objMail = Server.CreateObject("CDO.Message")
Set objCDOSYSCon = Server.CreateObject ("CDO.Configuration")
objCDOSYSCon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserver") = "localhost"
objCDOSYSCon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserverport") = 25
objCDOSYSCon.Fields("http://schemas.microsoft.com/cdo/configuration/sendusing") = 2
objCDOSYSCon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpconnectiontimeout") = 60
objCDOSYSCon.Fields.Update
Set objMail.Configuration = objCDOSYSCon 


objMail.From = email
objMail.To = "[email protected]"
objMail.Subject = "Online Inquiry"
objMail.TEXTBody = comments 
objMail.Send 
%>
 
Where do I put the code in the html file, I will post it here quickly.

<!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>Contact Us</title>
<style type="text/css">
<!--
body {
background-color: #CC0000;
}
.style1 { color: #c0c0c0;
font-size: 36px;
font-family: "Beyond Wonderland";
}
.style3 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
font-weight: bold;
color: #C0C0C0;
}
.style9 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #C0C0C0;
}
.style16 {color: #000000}
.style17 {color: #C0C0C0}
.style18 {
font-family: Georgia, "Times New Roman", Times, serif;
color: #C0C0C0;
}
-->
</style></head>

<body>
<div align="center"><span class="style1">Contact Us</span></div>
<p class="style3"><u>Contact Info:</u></p>
<p class="style17">Bruce Tager: +27834633261<br />
Glendyr Tager: +27842055089<br />
Nicole Tager: +27841234567<br />
Fax: 0866450322</p>
<p class="style9"><strong><u>Postal address :</u></strong> *</p>
<p class="style17">Post Net Suite 16******** <br />
Private Bag X16<br />
Hermanus <br />
7200 <br />
South Africa

<script type="text/javascript">var host = (("https:" == document.location.protocol) ? "https://secure." : "http://");document.write(unescape("%3Cscript src='" + host + "wufoo.com/scripts/embed/form.js' type='text/javascript'%3E%3C/script%3E"));</script>

<script type="text/javascript">
var z7x4m1 = new WufooForm();
z7x4m1.initialize({
'userName':'summerwoodtrading',
'formHash':'z7x4m1',
'autoResize':true,
'height':'501'});
z7x4m1.display();
</script>
 
Remove the parts of your code that are displaying the form fields and replace them with this :

Code: 
<form name="form1" method="post" action="send_email.asp">
  Name<br>
  <input type="text" name="fname">
  <br>
  Email <br>
  <input type="text" name="email" size="30">
  <br>
  Phone number <br>
  <input type="text" name="phone">
  <br>
  <textarea name="comments" cols="40" rows="10"></textarea>
  <br>
  <input type="submit" name="Submit" value="Submit">

Save the code below to a text file, then rename it to send_email.asp

Code: 
<%
email = request("email")
comments = request("comments")
fname = request("fname")
phone = request("phone")
Dim sHTMLBody 
Dim objMail 
Set objMail = Server.CreateObject("CDO.Message")
Set objCDOSYSCon = Server.CreateObject ("CDO.Configuration")
objCDOSYSCon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserver") = "localhost"
objCDOSYSCon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserverport") = 25
objCDOSYSCon.Fields("http://schemas.microsoft.com/cdo/configuration/sendusing") = 2
objCDOSYSCon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpconnectiontimeout") = 60
objCDOSYSCon.Fields.Update
Set objMail.Configuration = objCDOSYSCon 


objMail.From = email
objMail.To = "[email protected]"
objMail.Subject = "Online Inquiry"
objMail.HTMLBody = "Inquiry from "&fname&"<br>Telephone number "&phone&"<br>Comments <br>"&comments 
objMail.Send 
%>

Have fun :)
 
Here is the coding if you want to use ajax (sending the form without refreshing the page):

Your contact.html page:
Code: 
<!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>Contact Us</title>
<style type="text/css">
<!--
body {
	background-color: #CC0000;
}
.style1 {	color: #c0c0c0;
	font-size: 36px;
	font-family: "Beyond Wonderland";
}
.style3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	font-weight: bold;
	color: #C0C0C0;
}
.style9 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	color: #C0C0C0;
}
.style16 {color: #000000}
.style17 {color: #C0C0C0}
.style18 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #C0C0C0;
}
-->
</style>
<script type="text/javascript">
<!--
var xmlHttp;
function sendemail(){

	xmlHttp=GetXmlHttpObject();
	if (xmlHttp==null)
	  {
	  alert ("Your browser does not support AJAX!");
	  return;
	  } 
	var url="sendmail.php";
	params="action=send";
	fname = document.getElementById('fname').value;
	email = document.getElementById('email').value;
	phone = document.getElementById('phone').value;
	comments = document.getElementById('comments').value;
	params = params + '&fname=' + fname + '&email=' + email + '&phone=' + phone + '&comments=' + comments;
	params=params+"&sid="+Math.random();
	xmlHttp.onreadystatechange=stateChanged;
	xmlHttp.open('POST', url, true);
	xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xmlHttp.send(params);
}
function loadform(){

	xmlHttp=GetXmlHttpObject();
	if (xmlHttp==null)
	  {
	  alert ("Your browser does not support AJAX!");
	  return;
	  } 
	  
	var url="sendmail.php";
	params="action=load";
	params=params+"&sid="+Math.random();
	xmlHttp.onreadystatechange=stateChanged;
	xmlHttp.open('get', url+'?'+params, true);
	xmlHttp.send(null);
}
function stateChanged() { 
	if (xmlHttp.readyState==4){ 
		document.getElementById("results").innerHTML=xmlHttp.responseText;
	} else {
		document.getElementById("results").innerHTML='Busy...';
	}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
return xmlHttp;
}
-->
</script>
</head>

<body>
<div align="center"><span class="style1">Contact Us</span></div>
<p class="style3"><u>Contact Info:</u></p>
<p class="style17">Bruce Tager: +27834633261<br />
  Glendyr Tager: +27842055089<br />

  Nicole Tager: +27841234567<br />
  Fax: 0866450322</p>
<p class="style9"><strong><u>Postal address :</u></strong>  </p>
<p class="style17">Post Net Suite 16         <br />
  Private Bag X16<br />
  Hermanus <br />

  7200 <br />
  South Africa
<div id="results" class="style17">&nbsp;</div>  
 <script type="text/javascript"><!--
 loadform();
 -->
 </script>
</body>
</html>

save this as sendmail.php in the same folder (just remember to change the email address in the code) :
Code: 
<?php
// the email address to send the enquiry to
$myemail = "email_address@that_you_want_it_sent_to.com"; 
//the subject of the email sent
$subject = "Online Enquiry";
// The message to display when the message (email) is successfully sent	
$success_message = 'Thank you for your enquiry!<br>Someone from Summerwood Trading will get back to you!';
// The message to display when the message (email) cannot be sent for some obscure reason
$error_message = 'There was an error when submitting your enquiry!<br>Please try again or contact us using the numbers above!';

// shouldn't be neccesary to change anything below

switch ($_POST['action']){
	case 'send' : 	$postkeys = array_keys($_POST);
					$mes = "Date - ".date('Y-m-d H:i:s')."\r\n";
					$mes .= 'Name - '.$_POST['fname']."\r\n";
					$mes .= 'E-Mail - '.$_POST['email']."\r\n";
					$mes .= 'Phone - '.$_POST['phone']."\r\n";
					$mes .= "Comments\r\n".$_POST['comments']."\r\n";

					if (mail($myemail,$subject,$mes,$header = "From: ". $_POST['fname'] . " <" . $_POST['email'] . ">\r\n")){ 
						echo '<p>'.$success_message.'</p>';
					} else {
						echo '<p>'.$error_message.'</p>';
					}
					break;
	case 'load'	: 
	default		: ?>
<table style="width:50%;" border="0">
	<tr>
		<td>Name
		</td>
		<td><input name="fname" type="text" id="fname" size="40">
		</td>
	</tr>
	<tr>
		<td>Email
		</td>
		<td><input type="text" name="email" size="40" id="email">
		</td>
	</tr>
	<tr>
		<td>Phone number
		</td>
		<td><input name="phone" type="text" id="phone" size="40">
		</td>
	</tr>
	<tr>
		<td>Comments
		</td>
		<td><textarea name="comments" id="comments" cols="40" rows="10"></textarea>
		</td>
	</tr>
	<tr>
		<td colspan="2" style="text-align: center;"><input type="button" id="submit" name="submit" value="Submit" onClick="sendemail();">
		</td>
	</tr>
</table><?php
	
	break;
}

?>
 
JAV....AWESOME man that is really good thanks for your help, much appreciated.
 
JAV how can I put a little heading above the form in bold below the word South Africa and how can I change the font if I want to?

Any alternatives for the busy....
 
duderoo said:
JAV how can I put a little heading above the form in bold below the word South Africa and how can I change the font if I want to?

Any alternatives for the busy....
Click to expand...

For the busy word, look for
Code: 
document.getElementById("results").innerHTML='Busy...';
in the contact.html and just change the Busy.... between the ' ' to whatever you want it to say.

for the text above the form:

Code: 
<!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>Contact Us</title>
<style type="text/css">
<!--
body {
	background-color: #CC0000;
}
.style1 {	color: #c0c0c0;
	font-size: 36px;
	font-family: "Beyond Wonderland";
}
.style3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	font-weight: bold;
	color: #C0C0C0;
}
.style9 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	color: #C0C0C0;
}
.style16 {color: #000000}
.style17 {color: #C0C0C0}
.style18 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #C0C0C0;
}
.title {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #C0C0C0;
	font-size: 14px;
}
-->
</style>
<script type="text/javascript">
<!--
var xmlHttp;
function sendemail(){

	xmlHttp=GetXmlHttpObject();
	if (xmlHttp==null)
	  {
	  alert ("Your browser does not support AJAX!");
	  return;
	  } 
	var url="sendmail.php";
	params="action=send";
	fname = document.getElementById('fname').value;
	email = document.getElementById('email').value;
	phone = document.getElementById('phone').value;
	comments = document.getElementById('comments').value;
	params = params + '&fname=' + fname + '&email=' + email + '&phone=' + phone + '&comments=' + comments;
	params=params+"&sid="+Math.random();
	xmlHttp.onreadystatechange=stateChanged;
	xmlHttp.open('POST', url, true);
	xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xmlHttp.send(params);
}
function loadform(){

	xmlHttp=GetXmlHttpObject();
	if (xmlHttp==null)
	  {
	  alert ("Your browser does not support AJAX!");
	  return;
	  } 
	  
	var url="sendmail.php";
	params="action=load";
	params=params+"&sid="+Math.random();
	xmlHttp.onreadystatechange=stateChanged;
	xmlHttp.open('get', url+'?'+params, true);
	xmlHttp.send(null);
}
function stateChanged() { 
	if (xmlHttp.readyState==4){ 
		document.getElementById("results").innerHTML=xmlHttp.responseText;
	} else {
		document.getElementById("results").innerHTML='Busy...';
	}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
return xmlHttp;
}
-->
</script>
</head>

<body>
<div align="center"><span class="style1">Contact Us</span></div>
<p class="style3"><u>Contact Info:</u></p>

<p class="style17">Bruce Tager: +27834633261<br />
  Glendyr Tager: +27842055089<br />

  Nicole Tager: +27841234567<br />
  Fax: 0866450322</p>
<p class="style9"><strong><u>Postal address :</u></strong>  </p>
<p class="style17">Post Net Suite 16         <br />

  Private Bag X16<br />
  Hermanus <br />

  7200 <br />
  South Africa</p>
<p class="title">Enter the title that you want to appear in here</p>
<div id="results" class="style17">&nbsp;</div>  
 <script type="text/javascript"><!--
 loadform();
 -->
 </script>
</body>
</html>

You can change the font size, type and color by changing the values in
Code: 
.title {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #C0C0C0;
	font-size: 14px;
}
in the contact.html file
 
Hi Jav, thanks for the help.

Do you know how I can remove the 1 of 35 from the pictures box.

Also is there anyway to ensure that I retain the font on a person machine if they have not got it installed?

For the lightbox, if I wanted to carry over the snow, it will just be around the box right?

Thanks in advance.
 
You must log in or register to reply here.
Back
Top
Sign up to the MyBroadband newsletter
X