SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Apr 2010
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    how to make this an email form

    Good day. I have used an open source form, but I would like to know how to make it into a functional email form (so the form values are sent to an email address). As you can see, there is already a section at the bottom for contact details and a "submit" button, but it is not working. I see that there is no value set for the form action here etc. <form action="" id="cakeform" onsubmit="return false;">
    Not sure how to make this a functional email form. Any help would be appreciated.

    URL of form: http://kmkwebdevelopment.com/clients...-uprights.html

    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"><!-- InstanceBegin template="/Templates/sidebar.dwt" codeOutsideHTMLIsLocked="false" -->
    <head>
    <link rel="icon" href="favicon.ico" type="image/x-icon" /> 
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    
    
    </head>
    
    <body>
    
            
    <script type="text/javascript" src="js/formcalculations.js"></script>
        <link href="styles/quoteform.css" rel="stylesheet" type="text/css" />
    </head>
    
    <body onload='hideTotal()'>
        <div id="wrap">
            <form action="" id="cakeform" onsubmit="return false;">
            <div>
                <div class="cont_order">
                   <fieldset>
                    <legend>Piano Moving Estimate For Upright Pianos</legend>
                    <label ><span style="font-size:18px; color:#900">STEP 1:</span> Please select the size of your piano:</label>
    
                    <img style="margin-top:15px" src="images/small-piano-upright.jpg" alt="small upright piano" />
                    <label style="float:right; margin-right:202px; margin-top:30px" class='radiolabel'><input type="radio"  name="selectedcake" value="Round6" onclick="calculateTotal()" /> Small (Aka: Spinet, Console) <span style="font-weight:bold">$100</span></label>
                    <br/>
                    <img style="margin-top:15px" src="images/medium-piano-upright.jpg" alt="medium upright piano" />
                    <label style="float:right; margin-right:196px; margin-top:30px" class='radiolabel'><input type="radio"  name="selectedcake" value="Round8" onclick="calculateTotal()" /> Medium (Aka: Studio, Upright) <span style="font-weight:bold">$120</span></label><br/>
                    <img style="margin-top:15px" src="images/large-piano-upright.jpg" alt="large upright piano" />
    
                    <label style="float:right; margin-right:114px; margin-top:30px" class='radiolabel'><input type="radio"  name="selectedcake" value="Round10" onclick="calculateTotal()" /> Large (Aka: Full Size, Cabinet/Grand Upright) <span style="font-weight:bold">$150</span></label><br/>
                    <br/>
                    
                    <label ><span style="font-size:18px; color:#900">STEP 2:</span> Enter pick up and destination addresses:</label>
                    <br/>
                    
                    <p style="color:#900; font-weight:bold">PICK UP LOCATION:</p>
    
                    <label style="margin-left:15px; font-weight:normal" class="inlinelabel">Street Address:</label>
                    <input style="margin-left:10px" type="text" value=""  /><br />
                    <label style="margin-left:15px; font-weight:normal" class="inlinelabel">City:</label>
                    <input style="margin-left:71px" type="text" value=""  />
                    <br /><br />
                    <p style="color:#900; font-weight:bold">DESTINATION LOCATION:</p>
                    <label style="margin-left:15px; font-weight:normal" class="inlinelabel">Street Address:</label>
    
                    <input style="margin-left:10px" type="text" value=""  /><br />
                    <label style="margin-left:15px; font-weight:normal" class="inlinelabel">City:</label>
                    <input style="margin-left:71px" type="text" value=""  />
                    <br /><br />
                    
                    <label style="margin-left:15px">Approximate distance between "pickup location" and "destination"</label>
             <br />
                    <select style="margin-left:135px" id="filling" name='filling' onchange="calculateTotal()">
                    <option value="None">Choose Distance:</option>
    
                    <option value="Lemon">1 - 10km ($30)</option>
                    <option value="Custard">11 - 20km ($45)</option>
                    <option value="Fudge">21 - 30km ($60)</option>
                    <option value="Mocha">31 - 40km ($80)</option>
                   </select>
                    <br/><br />
                    
                    <label ><span style="font-size:18px; color:#900">STEP 3:</span> Is this a player piano?</label>
    
             <br />
                    <select style="margin-left:135px" id="filling2" name='filling2' onchange="calculateTotal()">
                    <option value="Raspberry">No</option>
                    <option value="Pineapple">Yes ($30)</option>
                   </select>
                    <br/><br />
                    
                    <label ><span style="font-size:18px; color:#900">STEP 4:</span> Are stairs involved? If so, please select from the diagram below:</label>
    
             <br />
                    <select style="margin-left:135px" id="filling3" name='filling3' onchange="calculateTotal()">
                    <option value="None2">None</option>
                    <option value="Dobash">Stairway A ($5)</option>
                    <option value="Mint">Stairway B ($10)</option>
                    <option value="Cherry">Stairway C ($15)</option>
                    <option value="Apricot">Stairway D ($20)</option>
    
                    <option value="Buttercream">Stairway E ($25)</option>            
                   </select>
                   <br /><br />
                    <img src="images/stairs.jpg" alt="stairs" />
                    <br/><br />
                   
                    <div id="totalPrice"></div>
                    <br />
                    <p style="color:#000"><span style="font-size:18px; color:#900">NOTE:</span> This estimate form is to be used as a cost "approximation" only. When speaking with one of our staff, this estimate may be altered.</p>
    
                    </fieldset>
                </div>
                <div class="cont_details">
                	<fieldset>
                    <legend>Contact Details</legend>
                    <label for='name'>Name</label>
                    <input type="text" id="name" name='name' />
                    <br/>
    
                    <label for='address'>Address</label>
                    <input type="text" id="address" name='address' />
                    <br/>
                    <label for='phonenumber'>Phone Number</label>
                    <input type="text"  id="phonenumber" name='phonenumber'/>
                    <br/>
                    </fieldset>
                </div>
    
                <input type='submit' id='submit' value='Submit' onclick="calculateTotal()" />
            </div>  
           </form>

  2. #2
    SitePoint Member
    Join Date
    Nov 2011
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There is no action because that form is handled by Javascript.

    But this is how you would send an email with a form.
    Code:
    $foo = $_POST['foo'];
    $bar = $_POST['bar'];
    
    $emailTo      = 'someone@example.com';
    $emailSubject = 'test email subject';
    $emailBody    = 'Foo: ' . $foo . ' Bar: ' .$bar;
    
    if (mail($emailTo, $emailSubject, $emailBody)) {
    	echo 'mail sent';
    }

  3. #3
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's probably best to send emails from the server, which I assume you realise since your post is the php thread.

    You need to send your <form> data to a php script which then sends the <form> data in an email using php's mail() function.

    This tute shows how you can send plain text emails, html emails and emails with attachments using mail().


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •