Eric
Eric

Reputation: 646

WordPress - AJAX Code Is Not Triggering Action

I am writing a plugin and the widget contains drop-down lists and needs to retrieve values for each successive drop-down list from the database using AJAX based on the previous drop-down list's selected value.

I am going off a slightly modified version of the code from the WordPress codex found here:http://codex.wordpress.org/AJAX_in_Plugins

For some reason the action function either isn't being called or the there is some error in my code:

// add action hooks

add_action('wp_footer', 'er_qm_ajax_handler' );
add_action('wp_ajax_repopulate_widget_club_type', 'repopulate_widget_club_type');
add_action('wp_ajax_nopriv_repopulate_widget_club_type', 'repopulate_widget_club_type');

// action for the wp_footer hook to insert the javascript

function er_qm_ajax_handler(){
    ?>
        <script type="text/javascript" >    
        jQuery(document).ready(function($) {
            jQuery('#widget_manufacturer').val('3').change(function(){
                var manufacturer = $("#widget_manufacturer").val();
                var data = {
                    action: 'repopulate_widget_club_type',
                    selected_manufacturer: manufacturer
                };
                // since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php
                jQuery.post(ajaxurl, data, function(response) {
                    alert('Got this from the server: ' + response);
                });
            });
        });
        </script>
    <?php
}

// The action function

function repopulate_widget_club_type(){
    die("Got to the action");
}

Not exactly sure what I am doing wrong as I am getting no response from the AJAX post, I know that the jQuery .change() is working as I set up some alert()'s to test it out once I altered the dropdown lists values.

Any thoughts and help will be greatly appreciated, thanks!

Upvotes: 0

Views: 1702

Answers (1)

Ovidiu Iacomi
Ovidiu Iacomi

Reputation: 776

You need to define the value of ajaxurl like this:

var ajaxurl = '<?php echo admin_url( 'admin-ajax.php' ); ?>'

It's prefferable to define it in javascript's global scope so before this line:

jQuery(document).ready(function($) {

Upvotes: 1

Related Questions