The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Help with basic HTML: contact info FORM
OddSpud
post Aug 26 2014, 06:11 AM
Post #1





Group: Members
Posts: 2
Joined: 26-August 14
Member No.: 21,460



Hello
I have made a landing page for my business
I created a form for potential customers to leave their details, which I would like to be sent to my email upon clicking the SUBMIT button. Alas, I don't seem to have done it right. Nothing occurs if I press the SUBMIT button.
I am no good at programming. I do imagine this is pretty basic, but I am unsuccessful so far.

the code
CODE


<!DOCTYPE html><html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="Keywords" content="">
<meta name="viewport" content="width=1010, maximum-scale=1">
<meta name="Description" content="">
<link href="http://fonts.googleapis.com/earlyaccess/alefhebrew.css" rel="stylesheet" type="text/css" />
<link href="http://m1.pagewiz.net/Resources/style2/lpCommon.css?v=4.011668103895" rel="stylesheet" type="text/css" />
<link href="css/bootstrap.min.css?v=4.011668103895" rel="stylesheet" type="text/css" />
<script>var confirm_type = 'alert';var confirm_url = '';var confirm_msg = 'YOUR DETAILS HAVE BEEN FORWARDED TO US!';var handler_url = 'http://preview.pagewiz.com/Handler/handler.aspx?pageid=137217';var tracker_url = 'http://stats.pagewiz.net/PWPixel.aspx';var pages_url = 'http://p1.pagewiz.net/';var required_msg = 'Please complete all required fields';var email_msg = 'Please fill valid email address';var alphabetic_msg = 'Please fill only alphabetic chars';var alphanumeric_msg = 'Please fill only alphanumeric chars';var numeric_msg = 'Please fill only numeric chars';var alert_type = 'msgbox';var page_id = '137217';var validation_dir = 'left';</script>

<!--[if lt IE 9]>
<style type="text/css">
</style>
<![endif]-->
<style>
body{background-color:#e9eaec;
}
#ElementsArea{position: absolute;left: 50%;top: 0px;z-index: 10;margin-left:-505px;
}
#SECTION1{position: relative; width:1010px; height: 660px;margin:auto;background-color:#ffffff;background-position:;background-repeat:;background-attachment:;background-size:;margin-top:0px;margin-bottom:0px;-moz-border-radius-topleft:;-moz-border-radius-topright:;-moz-border-radius-bottomleft:0px;-moz-border-radius-bottomright:;-webkit-border-top-left-radius:;-webkit-border-top-right-radius:;-webkit-border-bottom-left-radius:0px;-webkit-border-bottom-right-radius:;border-top-left-radius:;border-top-right-radius:;border-bottom-left-radius:0px;border-bottom-right-radius:;border-style:solid;border-width:0px;border-color:black;-moz-box-shadow:px px px;-webkit-box-shadow:px px px;box-shadow:px px px;}

#elm_2{position:absolute;z-index:1;height:651px;width:1000px;border:0px solid rgb(0, 0, 0);background-color:transparent;top:3px;left: 6.5px;-moz-border-radius-topleft:0;-moz-border-radius-topright:0px;-moz-border-radius-bottomleft:0;-moz-border-radius-bottomright:0;-webkit-border-top-left-radius:0;-webkit-border-top-right-radius:0px;-webkit-border-bottom-left-radius:0;-webkit-border-bottom-right-radius:0;border-top-left-radius:0;border-top-right-radius:0px;border-bottom-left-radius:0;border-bottom-right-radius:0;-moz-box-shadow:0px 0px 0px #ffffff;-webkit-box-shadow:0px 0px 0px #ffffff;box-shadow:0px 0px 0px #ffffff;}
#elm_3{position:absolute;z-index:2;height:46px;width:350px;border:0px solid rgb(255, 255, 255);background-color:transparent;top:153px;left: 68px;-moz-border-radius-topleft:0;-moz-border-radius-topright:0px;-moz-border-radius-bottomleft:0;-moz-border-radius-bottomright:0;-webkit-border-top-left-radius:0;-webkit-border-top-right-radius:0px;-webkit-border-bottom-left-radius:0;-webkit-border-bottom-right-radius:0;border-top-left-radius:0;border-top-right-radius:0px;border-bottom-left-radius:0;border-bottom-right-radius:0;-moz-box-shadow:0px 0px 0px #ffffff;-webkit-box-shadow:0px 0px 0px #ffffff;box-shadow:0px 0px 0px #ffffff;}
#elm_4{position:absolute;z-index:3;height:40px;width:350px;border:0px solid rgb(255, 255, 255);background-color:transparent;top:189px;left: 68px;-moz-border-radius-topleft:0;-moz-border-radius-topright:0px;-moz-border-radius-bottomleft:0;-moz-border-radius-bottomright:0;-webkit-border-top-left-radius:0;-webkit-border-top-right-radius:0px;-webkit-border-bottom-left-radius:0;-webkit-border-bottom-right-radius:0;border-top-left-radius:0;border-top-right-radius:0px;border-bottom-left-radius:0;border-bottom-right-radius:0;-moz-box-shadow:0px 0px 0px #ffffff;-webkit-box-shadow:0px 0px 0px #ffffff;box-shadow:0px 0px 0px #ffffff;}
#elm_5{position:absolute;z-index:4;height:40px;width:351px;border:0px solid rgb(255, 255, 255);background-color:transparent;top:226px;left: 68px;-moz-border-radius-topleft:0;-moz-border-radius-topright:0px;-moz-border-radius-bottomleft:0;-moz-border-radius-bottomright:0;-webkit-border-top-left-radius:0;-webkit-border-top-right-radius:0px;-webkit-border-bottom-left-radius:0;-webkit-border-bottom-right-radius:0;border-top-left-radius:0;border-top-right-radius:0px;border-bottom-left-radius:0;border-bottom-right-radius:0;-moz-box-shadow:0px 0px 0px #ffffff;-webkit-box-shadow:0px 0px 0px #ffffff;box-shadow:0px 0px 0px #ffffff;}
#elm_6{position:absolute;z-index:5;height:59px;width:325px;border:0px solid rgb(0, 0, 0);background-color:transparent;top:86px;left: 89px;-moz-border-radius-topleft:0;-moz-border-radius-topright:0px;-moz-border-radius-bottomleft:0;-moz-border-radius-bottomright:0;-webkit-border-top-left-radius:0;-webkit-border-top-right-radius:0px;-webkit-border-bottom-left-radius:0;-webkit-border-bottom-right-radius:0;border-top-left-radius:0;border-top-right-radius:0px;border-bottom-left-radius:0;border-bottom-right-radius:0;-moz-box-shadow:0px 0px 0px #ffffff;-webkit-box-shadow:0px 0px 0px #ffffff;box-shadow:0px 0px 0px #ffffff;}
#elm_7{position:absolute;z-index:7;height:30.333333253860474px;width:84.33333325386047px;border:1px solid rgb(112, 112, 112);background-color:#263d88;top:267px;left: 91.5px;-moz-border-radius-topleft:0;-moz-border-radius-topright:0px;-moz-border-radius-bottomleft:0;-moz-border-radius-bottomright:0;-webkit-border-top-left-radius:0;-webkit-border-top-right-radius:0px;-webkit-border-bottom-left-radius:0;-webkit-border-bottom-right-radius:0;border-top-left-radius:0;border-top-right-radius:0px;border-bottom-left-radius:0;border-bottom-right-radius:0;-moz-box-shadow:0px 0px 0px #ffffff;-webkit-box-shadow:0px 0px 0px #ffffff;box-shadow:0px 0px 0px #ffffff;}

#elm_3 .TopHolder label{float:right;width:110px;font-size:16px;font-weight:bold;line-height:30px;margin-left:10px;font-family:Tahoma;color:#263d88;}
#el_3{width:200px;height:30px;font-size:12px;}
#elm_4 .TopHolder label{float:right;width:110px;font-size:16px;font-weight:bold;line-height:30px;margin-left:10px;font-family:Tahoma;color:#263d88;}
#el_4{width:200px;height:30px;font-size:12px;}
#elm_5 .TopHolder label{float:right;width:110px;font-size:16px;font-weight:bold;line-height:30px;margin-left:10px;font-family:Tahoma;color:#263d88;}
#el_5{width:200px;height:30px;font-size:12px;}
#elm_6_headline a,#elm_6_headline{font-family:Tahoma;font-weight:bold;text-decoration:none solid rgb(0, 0, 0);font-style:normal;text-align:center;direction:ltr;font-size:24px;color:#263d88;}
#el_7{font-size:24px;font-weight:bold;font-family:Tahoma;color:#ffffff;}
.draggable{direction:rtl;text-align:right;float:right;} *[etype=Headline] {direction:ltr;}
</style>
</head>
<body>
<form id="frm" name="frm" target="frmpost" method="post" action="send_form_email.php">
<div id="ElementsArea">
<div class="draggable " name="Untitled" etype="Image" id="elm_2"><img id="elm_2_image" width="100%" height="100%" src="http://app.pagewiz.com/media/lloonqiavhgfrdcmciwiywusx_usermedia.png" title="" alt="" /></div><div class="draggable " name="Untitled" etype="textbox" id="elm_3"><div class="TopHolder"><span class="reqstar" style="right: -10px; color:#263d88">* </span><label>FULL NAME</label><div class="eHolder"><input placeholder="FIRST AND LAST NAME" value="" tabindex="1" ValidationType="AlphaBetic" isRequired="True" class="el" id="el_3" name="el_3" type="text"></div></div></div><div class="draggable " name="Untitled" etype="textbox" id="elm_4"><div class="TopHolder"><span class="reqstar" style="right: -10px; color:#263d88">* </span><label>TELEPHONE</label><div class="eHolder"><input placeholder="Phone Number" value="" tabindex="2" ValidationType="Numeric" isRequired="True" class="el" id="el_4" name="el_4" type="text"></div></div></div><div class="draggable " name="Untitled" etype="textbox" id="elm_5"><div class="TopHolder"><label>אימייל</label><div class="eHolder"><input placeholder="EMAIL ADDRESS" value="" tabindex="3" ValidationType="Email" isRequired="False" class="el" id="el_5" name="el_5" type="text"></div></div></div><div class="draggable section1 " name="Untitled" etype="Headline" id="elm_6"><div id="elm_6_headline">leave your details<br>and we will return&nbsp;to you ASAP</div></div><div class="draggable " name="Untitled" etype="button" id="elm_7"><span tabindex="4" style="display:inline-block; vertical-align:middle; height:100%"></span><span class="elButton" id="el_7">SUBMIT</span></div>
</div>
<div class="section" id="SECTION1" orderid="1">
                                    <div class="section-centered"></div>                                                                                
                                    </div>
<div style="display:none;"><iframe style="width:0px;height:0px;" frameborder="0" name="frmpost" id="frmpost"></iframe></div>
</form>
</body>
</html>


the PHP code
CODE

<?php

if(isset($_POST['email'])) {

    

    // EDIT THE 2 LINES BELOW AS REQUIRED

    $email_to = "sleepdepotil@gmail.com";

    $email_subject = "request for price offering";

    

    

    function died($error) {

        // your error code can go here

        echo "We are very sorry, but there were error(s) found with the form you submitted. ";

        echo "These errors appear below.<br /><br />";

        echo $error."<br /><br />";

        echo "Please go back and fix these errors.<br /><br />";

        die();

    }

    

    // validation expected data exists

    if(!isset($_POST['e1_3']) ||

        !isset($_POST['e1_4'])) {

        died('We are sorry, but there appears to be a problem with the form you submitted.');      

    }

    

    $name = $_POST['e1_3']; // required

    $telephone = $_POST['e1_4']; // required

    $email_from = $_POST['e1_5']; // not required
      
    $error_message = "";

    $email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/';

  if(!preg_match($email_exp,$email_from)) {

    $error_message .= 'The Email Address you entered does not appear to be valid.<br />';

  }

  if(strlen($error_message) > 0) {

    died($error_message);

  }

    $email_message = "Form details below.\n\n";

    

    function clean_string($string) {

      $bad = array("content-type","bcc:","to:","cc:","href");

      return str_replace($bad,"",$string);

    }

    

    $email_message .= "Name: ".clean_string($name)."\n";

    $email_message .= "Telephone: ".clean_string($telephone)."\n";

    $email_message .= "Email: ".clean_string($email_from)."\n";

    

    

// create email headers

$headers = 'From: '.$email_from."\r\n".

'Reply-To: '.$email_from."\r\n" .

'X-Mailer: PHP/' . phpversion();

@mail($email_to, $email_subject, $email_message, $headers);  

?>



<!-- include your own success html here -->



Thank you for contacting us. We will be in touch with you very soon.



<?php

}

?>


Thank you. I would appreciate any help.

This post has been edited by OddSpud: Aug 26 2014, 06:14 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Aug 26 2014, 06:28 AM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



You need a submit button.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
OddSpud
post Aug 26 2014, 09:55 AM
Post #3





Group: Members
Posts: 2
Joined: 26-August 14
Member No.: 21,460



QUOTE(pandy @ Aug 26 2014, 06:28 AM) *

You need a submit button.

Yes. That's the thing I can't seem to do :\
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Aug 26 2014, 11:04 AM
Post #4


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



INPUT type="submit" or type="image".
http://htmlhelp.com/reference/html40/forms/input.html
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 19th April 2024 - 10:16 PM