ajax wordpress contact form

UPDATE:

<form method="post" id="formApply"  action="<?php bloginfo('template_url');?>/inc/sendContact.php" name="applyForm">
    <div id="col1">
        <fieldset class="col-1">
            <div class="white info-line">Want to know more? Drop us a line and we'll get right back to you.</div>
            <label class="white text-label name" for="fname">Name:</label><input type="text" name="fname" id="fname" tabindex="1" />
            <div class="clear"></div>
            <label class="white text-label email" for="email">Email:</label><input type="email" class="lower" name="email" id="email"  tabindex="2"/>
            <div class="clear"></div>
            <label class="white text-label phone" for="phone">Phone:</label><input type="tel" name="phone" id="phone" tabindex="3" maxlength="10"/>
            <div class="white text-label checker-title" id="checkererror">I am interested in:</div>
            <input type="checkbox" id="checkbox-2-1" class="regular-checkbox big-checkbox" name="checker[]" value="Office Space" /><label for="checkbox-2-1"></label><div class="white text-label checker">Office Space</div>
            <input type="checkbox" id="checkbox-2-2" class="regular-checkbox big-checkbox" name="checker[]" value="Designated Workspace" /><label for="checkbox-2-2"></label><div class="white text-label checker">Designated Workspace</div>
            <input type="checkbox" id="checkbox-2-3" class="regular-checkbox big-checkbox" name="checker[]" value="Shared Space" /><label for="checkbox-2-3"></label><div class="white text-label checker">Shared Space</div>
        </fieldset>
    </div>
    <div id="col2">
        <fieldset class="col-2">
            <label class="white text-label note-label" for="notes">Notes:</label><br/>
            <textarea name="notes" id="notes" rows="10" cols="30" class="requiredField" tabindex="4"></textarea>
            <input type="hidden" name="submitted" id="submitted" class="submitted" value="true" /><button id="submit" type="submit">Submit Application</button>
        </fieldset>
    </div>
</form>

So i changed the form to a php on action – the email sends now fine – but it takes the user to the blank sendContact.php.

Read More

Is there a way of redirecting them back to the site? or doing this via ajax?

i tried a few ways in ajax and it wasnt sending the email

Thanks!

PHP:

require_once 'lib/swift_required.php';


$transport = Swift_MailTransport::newInstance();

$mailer = Swift_Mailer::newInstance($transport);

$name = Trim(stripslashes($_POST['fname']));
$email = Trim(stripslashes($_POST['email']));
$phone = Trim(stripslashes($_POST['phone']));
$notes  = Trim(stripslashes($_POST['notes']));
$checkbox = $_POST['checker'];


$message = Swift_Message::newInstance()
  ->setFrom(array('From_Email' => 'My Website'))
  ->setSubject('[My_Subject from '.$name.']')
  ->setTo(array('My_Email'))
  ->setBody(
'<html>'.
'<head></head>'.
'<body>'.
'<strong>Name:</strong><br />'.
$title.' '.$name.'<br /><br />'.
'<strong>Email Address:</strong><br />'.
$email.'<br /><br />'.
'<strong>Phone Number:</strong><br />'.
$phone.'<br /><br />'.
'<strong>Interested in:</strong><br />'.
implode('<br />', $checkbox).'<br /><br />'.
'<strong>Message:</strong><br />'.
$notes.'<br /><br />'.
'</body>'.
'</html>',
'text/html' );
$result = $mailer->send($message);  

Related posts

Leave a Reply

3 comments

  1. Best way to implement Ajax in WordPress is to use admin-ajax.php

    In your functions.php of your template add following code

    function MyAjaxCallBack()
    {
        foreach($_POST as $key=>$value)
            $$key = $value;
        //Email script will go here!
        die();
    }
    
    // creating Ajax call for WordPress  
    add_action('wp_ajax_nopriv_MyAjaxCallBack', 'MyAjaxCallBack');
    add_action('wp_ajax_MyAjaxCallBack', 'MyAjaxCallBack');
    

    Ajax script (Add it to header.php or footer.php):

    jQuery(document).ready(function() {  
        jQuery("#PleasePushMe").click(function(){ 
            jQuery.ajax({  
                type: 'POST',  
                url: '<?php echo admin_url('admin-ajax.php');?>',  
                data: {  
                    action: 'MyAjaxCallBack',
                    MyParam: 'MyParamValue'
                },  
                success: function(data, textStatus, XMLHttpRequest){  
                    alert(data);  
                },  
                error: function(MLHttpRequest, textStatus, errorThrown){  
                    alert(errorThrown);  
                }  
            });  
        });  
    });
    
  2. You need to add a submit handler:

    $(function(){
    
        $(".applywrap > form").on("submit", function(){
            // here you should probably validate your form fields...
    
            $.ajax({
                type : this.method,
                url  : this.action, // HTML <form> "action" attribute
                data : $(this).serialize(),
                cache: false
            })
            .done(console.log)
            .fail(console.warn)
    
            return false; // so the form won't refresh the page
        });
    
    });