Make a Contact Form Function Correctly

  • geno369329
  • Beginner
  • Beginner
  • User avatar
  • Posts: 44

Post 3+ Months Ago

Hey guys,

I'm at it again!!

I now have a intro page that links to 3 different websites! One of my websites is completely html. No flash! I have a contact section on my site and I need to make an html contact form!

Below is what i got from another forum, and I know there is some stuff that needs to be changed such as "id=im not sure what to put here"

Here is my code
Code: [ Select ]
<form labelid="formLabel_ContactForm" method="post" action="%wstx.formmailerurl%" name="Contact Form" id="wstForm_Contact">
<table cellspacing="1" cellpadding="5" border="1" bgcolor="#000000" width="100%">
<tbody>
<tr bgcolor="#000000">
<td align="center" style="font-family: verdana,arial,helvetica,sans-serif; font-size: 8pt; color: rgb(0, 0, 0); text-decoration: none; font-weight: normal;">
<table cellspacing="0" cellpadding="3" border="0" width="90%">
<tbody>
<tr>
<td align="center" style="font-family: arial,helvetica,sans-serif; font-size: 12pt; font-weight: bold;"><span controlid="wstForm_Contact" id="formLabel_ContactForm">Contact Us!</span><br />
</td>
</tr>
<tr>
<td style="font-family: verdana,arial,helvetica,sans-serif; font-size: 8pt; color: rgb(0, 0, 0); text-decoration: none; font-weight: normal; padding-bottom: 10px;">
<p align="justify"><font color="#dbaa70">Please contact us with your information so we can get intouch with you as soon as possible</p>
</td>
</tr>
</tbody>
</table>
<table cellspacing="1" cellpadding="3" border="0" bgcolor="#000000" width="90%">
<tbody>
<tr bgcolor="#000000">
<td style="font-size: 8pt; text-align: left;"><span controlid="formElement_First" id="formLabel_First"><font color="#dbaa70">First Name:</span></td>
<td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_First" name="First Name" id="formElement_First" /></td>
</tr>
<tr bgcolor="#000000">
<td style="font-size: 8pt; text-align: left;"><span controlid="formElement_Last" id="formLabel_Last"><font color="#dbaa70">Last Name:</span></td>
<td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_Last" name="Last Name" id="formElement_Last" /></td>
</tr>
<tbody>
<tr bgcolor="#000000">
<td style="font-size: 8pt; text-align: left;"><span controlid="formElement_Company" id="formLabel_Company"><font color="#dbaa70">Company:</span></td>
<td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_Company" name="Company" id="formElement_Company" /></td>
</tr>
<tr bgcolor="#000000">
<td style="font-size: 8pt; text-align: left;"><span controlid="formElement_City" id="formLabel_City"><font color="#dbaa70">City:</span></td>
<td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_City" name="City" id="formElement_City" /></td>
</tr>
<tr bgcolor="#000000">
<td style="font-size: 8pt; text-align: left;"><span controlid="formElement_Email" id="formLabel_Email"><font color="#dbaa70">Email:</span></td>
<td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_Email" name="Email" id="formElement_Email" /></td>
</tr>
<tr bgcolor="#000000">
<td style="font-size: 8pt; text-align: left;"><span controlid="formElement_Comments" id="formLabel_Comments"><font color="#dbaa70">Comments:</span></td>
<td style="font-size: 8pt; text-align: left;"><textarea labelid="formLabel_Comments" style="width: 100%;" cols="38" rows="4" name="Comments" id="formElement_Comments">Enter comments here!</textarea></td>
</tr>
</tbody>
</table>
<p><input type="submit" onclick="return wstxSubmitForm(this);" value="Submit" id="wstForm_Contact_Submit" /> <input type="reset" value="Reset" id="wstForm_Contact_Reset" /></p>
</td>
</tr>
</tbody>
</table>
<input type="hidden" value="Contact Form." name="FormMailerSubject" id="FormMailerSubject" /><input type="hidden" value="%wstx.project.BaseUrl%" name="FormMailerRedirect" id="FormMailerRedirect" />
</form>
  1. <form labelid="formLabel_ContactForm" method="post" action="%wstx.formmailerurl%" name="Contact Form" id="wstForm_Contact">
  2. <table cellspacing="1" cellpadding="5" border="1" bgcolor="#000000" width="100%">
  3. <tbody>
  4. <tr bgcolor="#000000">
  5. <td align="center" style="font-family: verdana,arial,helvetica,sans-serif; font-size: 8pt; color: rgb(0, 0, 0); text-decoration: none; font-weight: normal;">
  6. <table cellspacing="0" cellpadding="3" border="0" width="90%">
  7. <tbody>
  8. <tr>
  9. <td align="center" style="font-family: arial,helvetica,sans-serif; font-size: 12pt; font-weight: bold;"><span controlid="wstForm_Contact" id="formLabel_ContactForm">Contact Us!</span><br />
  10. </td>
  11. </tr>
  12. <tr>
  13. <td style="font-family: verdana,arial,helvetica,sans-serif; font-size: 8pt; color: rgb(0, 0, 0); text-decoration: none; font-weight: normal; padding-bottom: 10px;">
  14. <p align="justify"><font color="#dbaa70">Please contact us with your information so we can get intouch with you as soon as possible</p>
  15. </td>
  16. </tr>
  17. </tbody>
  18. </table>
  19. <table cellspacing="1" cellpadding="3" border="0" bgcolor="#000000" width="90%">
  20. <tbody>
  21. <tr bgcolor="#000000">
  22. <td style="font-size: 8pt; text-align: left;"><span controlid="formElement_First" id="formLabel_First"><font color="#dbaa70">First Name:</span></td>
  23. <td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_First" name="First Name" id="formElement_First" /></td>
  24. </tr>
  25. <tr bgcolor="#000000">
  26. <td style="font-size: 8pt; text-align: left;"><span controlid="formElement_Last" id="formLabel_Last"><font color="#dbaa70">Last Name:</span></td>
  27. <td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_Last" name="Last Name" id="formElement_Last" /></td>
  28. </tr>
  29. <tbody>
  30. <tr bgcolor="#000000">
  31. <td style="font-size: 8pt; text-align: left;"><span controlid="formElement_Company" id="formLabel_Company"><font color="#dbaa70">Company:</span></td>
  32. <td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_Company" name="Company" id="formElement_Company" /></td>
  33. </tr>
  34. <tr bgcolor="#000000">
  35. <td style="font-size: 8pt; text-align: left;"><span controlid="formElement_City" id="formLabel_City"><font color="#dbaa70">City:</span></td>
  36. <td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_City" name="City" id="formElement_City" /></td>
  37. </tr>
  38. <tr bgcolor="#000000">
  39. <td style="font-size: 8pt; text-align: left;"><span controlid="formElement_Email" id="formLabel_Email"><font color="#dbaa70">Email:</span></td>
  40. <td style="font-size: 8pt; text-align: left;"><input labelid="formLabel_Email" name="Email" id="formElement_Email" /></td>
  41. </tr>
  42. <tr bgcolor="#000000">
  43. <td style="font-size: 8pt; text-align: left;"><span controlid="formElement_Comments" id="formLabel_Comments"><font color="#dbaa70">Comments:</span></td>
  44. <td style="font-size: 8pt; text-align: left;"><textarea labelid="formLabel_Comments" style="width: 100%;" cols="38" rows="4" name="Comments" id="formElement_Comments">Enter comments here!</textarea></td>
  45. </tr>
  46. </tbody>
  47. </table>
  48. <p><input type="submit" onclick="return wstxSubmitForm(this);" value="Submit" id="wstForm_Contact_Submit" /> <input type="reset" value="Reset" id="wstForm_Contact_Reset" /></p>
  49. </td>
  50. </tr>
  51. </tbody>
  52. </table>
  53. <input type="hidden" value="Contact Form." name="FormMailerSubject" id="FormMailerSubject" /><input type="hidden" value="%wstx.project.BaseUrl%" name="FormMailerRedirect" id="FormMailerRedirect" />
  54. </form>


Again any help with this will be gladly appreciated. I need for the information to get submited to me via my email once a person clicks submit!

I also want to make certain fields "required" fields. How would I go about doin that?

Big thanks to all of you guys and gals who are way smarter and better at this, but yet still willing to help an amateur:)
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • graphixboy
  • Control + Z
  • Mastermind
  • User avatar
  • Posts: 1828
  • Loc: In the Great White North

Post 3+ Months Ago

Hey Geno glad we haven't scared you off of web design yet :-)

So for an all html site you get to learn a little javascript/php to get the contact form to function correctly.

Here's a great tutorial to get a contact form working. I think I would rewrite your from with this one since its a lot simpler than what you posted. Anyway this tutorial uses Javascript for validation (required fields) and a php file to actually tell your server to send the email.

Good luck and let us know if you have any problems.
  • geno369329
  • Beginner
  • Beginner
  • User avatar
  • Posts: 44

Post 3+ Months Ago

great thanks graphixboy...haha...i pm'ed you...just ignore it!!!
  • geno369329
  • Beginner
  • Beginner
  • User avatar
  • Posts: 44

Post 3+ Months Ago

Alright I've got the contact box created. I loved the tutorial! It was so helpful!!

All they errors pop up like they're supposed to, and I get a success message.

My question now, is how do I make it so the info in my contact box is sent to me in an email?

Here is the HTML for my contact box:
Code: [ Select ]
<!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>
<script src="jquery-1.2.3.pack.js"></script>
<script src="runonload.js"></script>
<script src="tutorial.js"></script>
<link href="contact.css" media="all" type="text/css" rel="stylesheet">
</head>
 
<body>
<div id="contact_form">
  <form name="contact" method="post" action="">
    <fieldset>
      <label for="name" id="name_label">Name</label>
      <input type="text" name="name" id="name" size="30" value="" class="text-input" />
      <label class="error" for="name" id="name_error">Please enter your name</label>
     
      <label for="Company" id="Company_label">Company</label>
      <input type="text" name="Company" id="Company" size="30" value="" class="text-input" />
      <label class="error" for="Company" id="Company_error">Please enter your company name</label>
     
      <label for="Email" id="Email_label">Email</label>
      <input type="text" name="Email" id="Email" size="30" value="" class="text-input" />
      <label class="error" for="Email" id="Email_error">Please enter your email address</label>
     
      <label for="phone" id="phone_label">Phone</label>
      <input type="text" name="phone" id="phone" size="30" value="" class="text-input" />
      <label class="error" for="phone" id="phone_error">Please enter your phone number</label>
     
      <label for="Project" id="Project_label">Project Details</label>
      <input type="text" name="Project" id="Project" size="30" value="" class="text-input" />
      <label class="error" for="Project" id="Project_error">Please enter project details</label>
     
   
     
        <br />
      <input type="submit" name="submit" class="button" id="submit_btn" value="Send" />
    </fieldset>
  </form>
</div>
</body>
</html>
 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Contact Us</title>
  6. <script src="jquery-1.2.3.pack.js"></script>
  7. <script src="runonload.js"></script>
  8. <script src="tutorial.js"></script>
  9. <link href="contact.css" media="all" type="text/css" rel="stylesheet">
  10. </head>
  11.  
  12. <body>
  13. <div id="contact_form">
  14.   <form name="contact" method="post" action="">
  15.     <fieldset>
  16.       <label for="name" id="name_label">Name</label>
  17.       <input type="text" name="name" id="name" size="30" value="" class="text-input" />
  18.       <label class="error" for="name" id="name_error">Please enter your name</label>
  19.      
  20.       <label for="Company" id="Company_label">Company</label>
  21.       <input type="text" name="Company" id="Company" size="30" value="" class="text-input" />
  22.       <label class="error" for="Company" id="Company_error">Please enter your company name</label>
  23.      
  24.       <label for="Email" id="Email_label">Email</label>
  25.       <input type="text" name="Email" id="Email" size="30" value="" class="text-input" />
  26.       <label class="error" for="Email" id="Email_error">Please enter your email address</label>
  27.      
  28.       <label for="phone" id="phone_label">Phone</label>
  29.       <input type="text" name="phone" id="phone" size="30" value="" class="text-input" />
  30.       <label class="error" for="phone" id="phone_error">Please enter your phone number</label>
  31.      
  32.       <label for="Project" id="Project_label">Project Details</label>
  33.       <input type="text" name="Project" id="Project" size="30" value="" class="text-input" />
  34.       <label class="error" for="Project" id="Project_error">Please enter project details</label>
  35.      
  36.    
  37.      
  38.         <br />
  39.       <input type="submit" name="submit" class="button" id="submit_btn" value="Send" />
  40.     </fieldset>
  41.   </form>
  42. </div>
  43. </body>
  44. </html>
  45.  


Here is My CSS
Code: [ Select ]
@charset "utf-8";
 
*                       { margin:0; padding:0; outline:none; }
body                    { font-size:62.5%; font-family:Arial, Helvetica, sans-serif;
                        background: #000000 url(/images/body_bg.png) repeat-x;
                                                margin-top:40px; }
 
#contact_form                   { width:600px; margin:0 auto; height:200px; padding:10px 0;
                                                background: transparent url(/images/body_bg.png) no-repeat;
                        position:relative; }
form fieldset                   { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:1.2em;
                                                margin:0px 0px 20px 0px; width:578px; position:relative;
                                                border:0;display:block; padding: 0px 10px 8px; }
form fieldset legend    { border-width:1px; border-style:solid; border-color:#BBBB66; color:#3D7169;
                                                font-weight:bold; font-variant:small-caps; font-size:140%; padding:4px 8px;
                                                margin:0px 0px 10px 0px; position:relative; top: -12px; background:white; }
label                                   { font-size:90%; display:block; float:left; width:10em; text-align:right;
                                                margin:.2em .2em 0 0; color:#ffd; font-weight:bold;padding:8px 0px; }
label.error           { font-weight:normal;color:red;text-align:left;width:199px; padding-left:25px;
                        background: transparent url(/images/cancel.png) no-repeat scroll left; }
input.text-input            { margin:4px;padding:2px 0;color:#333; }
 
label#name_label        { position:absolute; top:0; left:0; }
input#name              { position:absolute; top:0; left:110px; }
label#name_error        { position:absolute; top:18px; left:120px; }
 
label#Company_label     { position:absolute; top:45px; left:0px; }
input#Company           { position:absolute; top:45px; left:110px; }
label#Company_error     { position:absolute; top:63px; left:100px; }
 
label#Email_label       { position:absolute; top:90px; left:0px; }
input#Email             { position:absolute; top:90px; left:110px; }
label#Email_error       { position:absolute; top:108px; left:100px; }
 
label#phone_label       { position:absolute; top:135px; left:0px; }
input#phone             { position:absolute; top:135px; left:110px; }
label#phone_error       { position:absolute; top:153px; left:100px; }
 
label#Project_label     { position:absolute; top:180px; left:0px; }
input#Project           { position:absolute; top:180px; left:110px; }
label#Project_error     { position:absolute; top:198px; left:100px; }
 
input.button                    { position:absolute; top:220px; left:120px; padding:3px 6px;
                        border:2px solid #fff; margin:20px 0px 0px 0px; color:#3D7169;
                                                font-family:Verdana, Arial, Helvetica, sans-serif;
                                                background:#CCC; -moz-border-radius:5px; }
 
input.button:hover      { background:#009FAA none repeat scroll 0% 0%; color:white; }
#message                            { width:180px;margin:60px 0 0 100px; }
#message h2                     { font-size:150%;color:white; }
#message p                      { color:white;font-weight:bold;margin:6px 0px; }
#checkmark                      { position:relative;top:-46px;left:-60px; }
 
  1. @charset "utf-8";
  2.  
  3. *                       { margin:0; padding:0; outline:none; }
  4. body                    { font-size:62.5%; font-family:Arial, Helvetica, sans-serif;
  5.                         background: #000000 url(/images/body_bg.png) repeat-x;
  6.                                                 margin-top:40px; }
  7.  
  8. #contact_form                   { width:600px; margin:0 auto; height:200px; padding:10px 0;
  9.                                                 background: transparent url(/images/body_bg.png) no-repeat;
  10.                         position:relative; }
  11. form fieldset                   { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:1.2em;
  12.                                                 margin:0px 0px 20px 0px; width:578px; position:relative;
  13.                                                 border:0;display:block; padding: 0px 10px 8px; }
  14. form fieldset legend    { border-width:1px; border-style:solid; border-color:#BBBB66; color:#3D7169;
  15.                                                 font-weight:bold; font-variant:small-caps; font-size:140%; padding:4px 8px;
  16.                                                 margin:0px 0px 10px 0px; position:relative; top: -12px; background:white; }
  17. label                                   { font-size:90%; display:block; float:left; width:10em; text-align:right;
  18.                                                 margin:.2em .2em 0 0; color:#ffd; font-weight:bold;padding:8px 0px; }
  19. label.error           { font-weight:normal;color:red;text-align:left;width:199px; padding-left:25px;
  20.                         background: transparent url(/images/cancel.png) no-repeat scroll left; }
  21. input.text-input            { margin:4px;padding:2px 0;color:#333; }
  22.  
  23. label#name_label        { position:absolute; top:0; left:0; }
  24. input#name              { position:absolute; top:0; left:110px; }
  25. label#name_error        { position:absolute; top:18px; left:120px; }
  26.  
  27. label#Company_label     { position:absolute; top:45px; left:0px; }
  28. input#Company           { position:absolute; top:45px; left:110px; }
  29. label#Company_error     { position:absolute; top:63px; left:100px; }
  30.  
  31. label#Email_label       { position:absolute; top:90px; left:0px; }
  32. input#Email             { position:absolute; top:90px; left:110px; }
  33. label#Email_error       { position:absolute; top:108px; left:100px; }
  34.  
  35. label#phone_label       { position:absolute; top:135px; left:0px; }
  36. input#phone             { position:absolute; top:135px; left:110px; }
  37. label#phone_error       { position:absolute; top:153px; left:100px; }
  38.  
  39. label#Project_label     { position:absolute; top:180px; left:0px; }
  40. input#Project           { position:absolute; top:180px; left:110px; }
  41. label#Project_error     { position:absolute; top:198px; left:100px; }
  42.  
  43. input.button                    { position:absolute; top:220px; left:120px; padding:3px 6px;
  44.                         border:2px solid #fff; margin:20px 0px 0px 0px; color:#3D7169;
  45.                                                 font-family:Verdana, Arial, Helvetica, sans-serif;
  46.                                                 background:#CCC; -moz-border-radius:5px; }
  47.  
  48. input.button:hover      { background:#009FAA none repeat scroll 0% 0%; color:white; }
  49. #message                            { width:180px;margin:60px 0 0 100px; }
  50. #message h2                     { font-size:150%;color:white; }
  51. #message p                      { color:white;font-weight:bold;margin:6px 0px; }
  52. #checkmark                      { position:relative;top:-46px;left:-60px; }
  53.  



And then here is my Javascript
Code: [ Select ]
$(function() {
  $('.error').hide();
  $('input.text-input').css({backgroundColor:"#FFFFFF"});
  $('input.text-input').focus(function(){
    $(this).css({backgroundColor:"#FFDDAA"});
  });
  $('input.text-input').blur(function(){
    $(this).css({backgroundColor:"#FFFFFF"});
  });
 
  $(".button").click(function() {
        // validate and process form
        // first hide any error messages
    $('.error').hide();
       
      var name = $("input#name").val();
        if (name == "") {
      $("label#name_error").show();
      $("input#name").focus();
      return false;
    }
        var Company = $("input#Company").val();
        if (Company == "") {
      $("label#Company_error").show();
      $("input#Company").focus();
      return false;
    }
        var Email = $("input#Email").val();
        if (Email == "") {
      $("label#Email_error").show();
      $("input#Email").focus();
      return false;
    }
        var phone = $("input#phone").val();
        if (phone == "") {
      $("label#phone_error").show();
      $("input#phone").focus();
      return false;
    }
        var Project = $("input#Project").val();
        if (Project == "") {
      $("label#Project_error").show();
      $("input#Project").focus();
      return false;
    }
       
        var dataString = 'name='+ name + 'Company='+ Company + 'Email='+ Email + '&phone=' + phone + '&Project=' + Project;
        //alert (dataString);return false;
       
        $.ajax({
      type: "POST",
      url: "bin/process.php",
      data: dataString,
      success: function() {
        $('#contact_form').html("<div id='message'></div>");
        $('#message').html("<h2>Contact Form Submitted!</h2>")
        .append("<p>We will be in touch soon.</p>")
        .hide()
        .fadeIn(1500, function() {
          $('#message').append("<img id='checkmark' src='images/check.png' />");
        });
      }
     });
    return false;
    });
});
runOnLoad(function(){
  $("input#name").select().focus();
});
 
  1. $(function() {
  2.   $('.error').hide();
  3.   $('input.text-input').css({backgroundColor:"#FFFFFF"});
  4.   $('input.text-input').focus(function(){
  5.     $(this).css({backgroundColor:"#FFDDAA"});
  6.   });
  7.   $('input.text-input').blur(function(){
  8.     $(this).css({backgroundColor:"#FFFFFF"});
  9.   });
  10.  
  11.   $(".button").click(function() {
  12.         // validate and process form
  13.         // first hide any error messages
  14.     $('.error').hide();
  15.        
  16.       var name = $("input#name").val();
  17.         if (name == "") {
  18.       $("label#name_error").show();
  19.       $("input#name").focus();
  20.       return false;
  21.     }
  22.         var Company = $("input#Company").val();
  23.         if (Company == "") {
  24.       $("label#Company_error").show();
  25.       $("input#Company").focus();
  26.       return false;
  27.     }
  28.         var Email = $("input#Email").val();
  29.         if (Email == "") {
  30.       $("label#Email_error").show();
  31.       $("input#Email").focus();
  32.       return false;
  33.     }
  34.         var phone = $("input#phone").val();
  35.         if (phone == "") {
  36.       $("label#phone_error").show();
  37.       $("input#phone").focus();
  38.       return false;
  39.     }
  40.         var Project = $("input#Project").val();
  41.         if (Project == "") {
  42.       $("label#Project_error").show();
  43.       $("input#Project").focus();
  44.       return false;
  45.     }
  46.        
  47.         var dataString = 'name='+ name + 'Company='+ Company + 'Email='+ Email + '&phone=' + phone + '&Project=' + Project;
  48.         //alert (dataString);return false;
  49.        
  50.         $.ajax({
  51.       type: "POST",
  52.       url: "bin/process.php",
  53.       data: dataString,
  54.       success: function() {
  55.         $('#contact_form').html("<div id='message'></div>");
  56.         $('#message').html("<h2>Contact Form Submitted!</h2>")
  57.         .append("<p>We will be in touch soon.</p>")
  58.         .hide()
  59.         .fadeIn(1500, function() {
  60.           $('#message').append("<img id='checkmark' src='images/check.png' />");
  61.         });
  62.       }
  63.      });
  64.     return false;
  65.     });
  66. });
  67. runOnLoad(function(){
  68.   $("input#name").select().focus();
  69. });
  70.  


Thanks guys, I'm sooo close:)
  • graphixboy
  • Control + Z
  • Mastermind
  • User avatar
  • Posts: 1828
  • Loc: In the Great White North

Post 3+ Months Ago

If I remember correctly there's a php file in the tutorial demo files that should be able to take care of that portion (has to be on your server to send the email). You may have to change some paths to get it to work correctly on your server but it works right out of the box for me.

Another option is outlined Here but you'll have to change the code to suit your needs and form field names.

Basically whats going on here is that the javascript is taking your form data and passing it to a php script that tells your webserver to send an email using a program that exists on your server. With this in mind you will have to put the stuff online to be able to test anything.

Make sense?
  • geno369329
  • Beginner
  • Beginner
  • User avatar
  • Posts: 44

Post 3+ Months Ago

Im an idiot...haha...you're right! I think i found what you were talking about.

so now I uploaded everything, and im wondering where do I actually tell all of this information filled out in the contact form to be emailed to my address?


Code: [ Select ]
<?php
if ((isset($_POST['name'])) && (strlen(trim($_POST['name'])) > 0)) {
    $name = stripslashes(strip_tags($_POST['name']));
} else {$name = 'No name entered';}
if ((isset($_POST['email'])) && (strlen(trim($_POST['email'])) > 0)) {
    $email = stripslashes(strip_tags($_POST['email']));
} else {$email = 'No email entered';}
if ((isset($_POST['phone'])) && (strlen(trim($_POST['phone'])) > 0)) {
    $phone = stripslashes(strip_tags($_POST['phone']));
} else {$phone = 'No phone entered';}
ob_start();
?>
<html>
<head>
<style type="text/css">
</style>
</head>
<body>
<table width="550" border="1" cellspacing="2" cellpadding="2">
  <tr bgcolor="#eeffee">
    <td>Name</td>
    <td><?=$name;?></td>
  </tr>
  <tr bgcolor="#eeeeff">
    <td>Email</td>
    <td><?=$email;?></td>
  </tr>
  <tr bgcolor="#eeffee">
    <td>Phone</td>
    <td><?=$phone;?></td>
  </tr>
</table>
</body>
</html>
<?
$body = ob_get_contents();
 
$to = 'someone@example.com';
$email = 'email@example.com';
$fromaddress = "you@example.com";
$fromname = "Online Contact";
 
require("phpmailer.php");
 
$mail = new PHPMailer();
 
$mail->From     = "mail@yourdomain.com";
$mail->FromName = "Contact Form";
$mail->AddAddress("email_address@example.com","Name 1");
$mail->AddAddress("another_address@example.com","Name 2");
 
$mail->WordWrap = 50;
$mail->IsHTML(true);
 
$mail->Subject  =  "Demo Form:  Contact form submitted";
$mail->Body     =  $body;
$mail->AltBody  =  "This is the text-only body";
 
if(!$mail->Send()) {
    $recipient = 'your_email@example.com';
    $subject = 'Contact form failed';
    $content = $body;   
  mail($recipient, $subject, $content, "From: mail@yourdomain.com\r\nReply-To: $email\r\nX-Mailer: DT_formmail");
  exit;
}
?>
 
  1. <?php
  2. if ((isset($_POST['name'])) && (strlen(trim($_POST['name'])) > 0)) {
  3.     $name = stripslashes(strip_tags($_POST['name']));
  4. } else {$name = 'No name entered';}
  5. if ((isset($_POST['email'])) && (strlen(trim($_POST['email'])) > 0)) {
  6.     $email = stripslashes(strip_tags($_POST['email']));
  7. } else {$email = 'No email entered';}
  8. if ((isset($_POST['phone'])) && (strlen(trim($_POST['phone'])) > 0)) {
  9.     $phone = stripslashes(strip_tags($_POST['phone']));
  10. } else {$phone = 'No phone entered';}
  11. ob_start();
  12. ?>
  13. <html>
  14. <head>
  15. <style type="text/css">
  16. </style>
  17. </head>
  18. <body>
  19. <table width="550" border="1" cellspacing="2" cellpadding="2">
  20.   <tr bgcolor="#eeffee">
  21.     <td>Name</td>
  22.     <td><?=$name;?></td>
  23.   </tr>
  24.   <tr bgcolor="#eeeeff">
  25.     <td>Email</td>
  26.     <td><?=$email;?></td>
  27.   </tr>
  28.   <tr bgcolor="#eeffee">
  29.     <td>Phone</td>
  30.     <td><?=$phone;?></td>
  31.   </tr>
  32. </table>
  33. </body>
  34. </html>
  35. <?
  36. $body = ob_get_contents();
  37.  
  38. $to = 'someone@example.com';
  39. $email = 'email@example.com';
  40. $fromaddress = "you@example.com";
  41. $fromname = "Online Contact";
  42.  
  43. require("phpmailer.php");
  44.  
  45. $mail = new PHPMailer();
  46.  
  47. $mail->From     = "mail@yourdomain.com";
  48. $mail->FromName = "Contact Form";
  49. $mail->AddAddress("email_address@example.com","Name 1");
  50. $mail->AddAddress("another_address@example.com","Name 2");
  51.  
  52. $mail->WordWrap = 50;
  53. $mail->IsHTML(true);
  54.  
  55. $mail->Subject  =  "Demo Form:  Contact form submitted";
  56. $mail->Body     =  $body;
  57. $mail->AltBody  =  "This is the text-only body";
  58.  
  59. if(!$mail->Send()) {
  60.     $recipient = 'your_email@example.com';
  61.     $subject = 'Contact form failed';
  62.     $content = $body;   
  63.   mail($recipient, $subject, $content, "From: mail@yourdomain.com\r\nReply-To: $email\r\nX-Mailer: DT_formmail");
  64.   exit;
  65. }
  66. ?>
  67.  


I know i should put my address where it says 'mail@yourdomain.com' and 'your_email@example.com'

Is that the only places I need to put my address?
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

Actually, the $recipient, is the person recieving it if I'm not mistaken... it tells the script the to part.
  • graphixboy
  • Control + Z
  • Mastermind
  • User avatar
  • Posts: 1828
  • Loc: In the Great White North

Post 3+ Months Ago

so I realized as I'm looking at it that the included form processor is pretty complicated. Give me a bit and I'll find an easier one for you to use/modify

Post Information

  • Total Posts in this topic: 8 posts
  • Users browsing this forum: No registered users and 89 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.