Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I have a working html form with jQuery validation and have been submitting the data with AJAX, I am now trying to copy this form in to my own Wordpress theme, but I can't see where I am going wrong in using AJAX in Wordpress.

I am referencing subscribe.js in my headerand this is my form:

<div id="subscribe">
    <input type="text" id="emailsub" class="text-input" name="email" placeholder="your email address" />
    <input type="submit" src="<?php bloginfo('template_directory'); ?>/images/send.jpg" alt="Send" width="37" height="27" name="#" id="submitsub" class="contactbutton" />
    <br />
    <!-- Email Validation -->
    <span id="errorSubEmail" class="subError"></span>
    <span id="formSubProgress" class="subProgress"></span>
</div>

I am using some jQuery validation, but here is the AJAX:

$.ajax({
        type: "POST",
        url: "http://mywebsite.co.uk/wp/wp-admin/admin-ajax.php",
        data: {
            action: 'ajaxfunction',
            email: email,
        }   ,
        success: function(msg) {

            //alert(msg);

            // Check to see if the mail was successfully sent
            if(msg=='Mail sent') {
                // Update the progress bar
                $('.email_wrap #formSubProgress').html('<img src="images/ajax-complete.png" /> Thankyou!').delay(2000).fadeOut(400);

                // Clear the subject field and message textbox
            //  $('.email_wrap #subject').val('');
            //  $('.email_wrap #message').val('');
            } else {
                $('.email_wrap #formSubProgress').html('');
                alert('There was an error sending your email. Please try again.');
            }

            // Activate the submit button
            $('.email_wrap #submitsub').attr("disabled", "");
        },
        error: function(ob,errStr) {
            $('.email_wrap #formSubProgress').html('');
            alert('There was an error sending your email. Please try again.');

            // Activate the submit button
            $('.email_wrap #submitsub').attr("disabled", "");
        }
    });

And my functions.php:

add_action('init', 'add_contact_script');
function add_contact_script() {
wp_register_script('contact', get_bloginfo('template_directory') . '/subscribe.js', array('jquery'), '1.0' );
wp_enqueue_script('contact');
}
function ajax_contact() {
if(!isset($_POST['email'])
   ) {
 die('Error: aaaa Missing variables');
}
}

function ajaxfunction() {
//  die("ajaxfunction is called");
if(!isset($_POST['email'])  ) {
    die('Error: Missing variables');
} else {

$email=$_POST['email'];

$to='you@email.com';

$headers = 'The following person has registered to be notified when your webite launches: '."\r\n" ."\r\n" .
    'Email: '.$email."\r\n";

$subject = 'A new person has registered to be updated when you go live';    

if(mail($to, $subject, 
    $headers)) {
    die('Mail sent');
} else {
    die('Error: Mail failed');
}
}
  } 
   add_action( 'wp_ajax_nopriv_ajaxfunction', 'ajaxfunction' );  
   add_action( 'wp_ajax_ ajaxfunction', 'ajaxfunction' ); 
share|improve this question
    
What happens if you use jQuery() instead of the unsupported $? –  toscho Jul 2 '12 at 18:38
    
Thanks but I was using jQuery(document).ready(function($) { which enclosed the whole file including the validation, but even if I do change $ to jQuery for the AJAX there is no change, validation still works but AJAX doesn't –  Ben Jackson Jul 2 '12 at 19:04
2  
What exactly isn't working about it? What is the results that you get? –  Otto Sep 5 '12 at 15:21

1 Answer 1

You have a typo: wp_ajax_ ajaxfunction. there's a space after the underscore.

also, use wp_localize_script to set your admin-ajax path:

wp_enqueue_script(
    'contact',
    get_bloginfo('template_directory') . '/subscribe.js',
    array('jquery'),
    '1.0'
);
wp_localize_script(
    'contact',
    'ContactAjax',
    array(
        'ajaxurl' => admin_url( 'admin-ajax.php' )
    )
);

then in your javascript, use ContactAjax.ajaxurl

share|improve this answer
    
Are there not any other problems in my code? Making your change still doesn't get the AJAX to work :( –  Ben Jackson Jul 2 '12 at 19:18
1  
You need to provide more details simply saying "doesn't work" makes it impossible to help you. What doesn't work? Also what event are you attaching your ajax js code to? I can probably assure you that the ajax isn't even being run. Please post all your javascript related to the form submission and validation. Also attach your wp_enque_script to wp_enqueue_scripts hook not init. –  Chris_O Jan 12 '13 at 18:19
    
Agree that you need to confirm the ajax code is even being fired. You should be able to see whether the ajax is run by looking in your console. –  helgatheviking Jul 13 '13 at 19:07

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.