CODEWITHSUNDEEP
phpjquerywordpressadmin-ajax
Daniel
Daniel

Reputation: 199

Wordpress admin-ajax.php 400 Failed to load

Am using this script 'WordPress CPT Ajax filtering' found here on GitHub.

Everything work as i need it apart from the 'All' filter, click this and all post disappear and i get the error below, but the other cat filters work.

XHR failed loading: POST "**/wp-admin/admin-ajax.php". send @ jquery.min.js:2

anyone experience the same-thing or know how to get it to work?

First 2 snippets are in the theme template page file. Last snippet in functions.php

  <section class="space80" id="team">
        <h2 class="txtGradient"> family </h2>
    
    <div class="filter-contain">
        <?php
          $taxonomy = 'team_location';
          $tax_terms = get_terms($taxonomy);
        ?>
        
        <ul>
            <li id="all-projects" style="display:none;">
                <a href="#" class="all-cats  ajax" data-cpt-name="project" id="all-projects-link">All</a>
            </li>
            <li id="cat-42">
                <a href="#" class="emea ajax" data-term-number="42" title="All">All</a>
            </li>           
            <li id="cat-38">
                <a href="#" class="emea ajax" data-term-number="38" title="EMEA">EMEA</a>
            </li>
                    <li id="cat-40">
                <a href="#" class="americas ajax" data-term-number="40" title="Americas">Americas</a>
            </li>
                    <li id="cat-39">
                <a href="#" class="asia ajax" data-term-number="39" title="Asia">Asia</a>
            </li>
                    <li id="cat-41">
                <a href="#" class="australasia ajax" data-term-number="41" title="Australasia">Australasia</a>
            </li>
          </ul>
        
    </div>
        
    <div id="category-post-content" class="project-container row">
        <?php $loop = new WP_Query( array( 'post_type' => 'team-member', 'posts_per_page' => 20, 'orderby' => 'ID', 'order' => 'ASC', ) );
            if ( $loop->have_posts() ) :
            while ( $loop->have_posts() ) : $loop->the_post(); ?>
                <div class="col-md-6 col-lg-4 space30">
                <div class="project-tile ">
                    <a href="<?php the_permalink(); ?>"> <?php echo get_the_post_thumbnail( $page->ID, 'large' ); ?></a>
                    <div class="project-text">
                        <h3 class="posttitle">
                            <?php echo get_the_title(); ?>
                        </h3>
                        <h4>
                            <?php the_field('team_title'); ?>
                        </h4>
                    </div>
                    </div> 
                    </div> 
        <?php endwhile; endif; wp_reset_postdata(); ?>
    </div>
</section>

function cat_ajax_get(catID) {
    var ajaxurl = '/wp-admin/admin-ajax.php';
    jQuery.ajax({
        type: 'POST',
        url: ajaxurl,
        data: {"action": "load-filter", cat: catID },
        success: function(response) {
            jQuery("#category-post-content").html(response);
            return false;
        }
    });
}
function all_cats_ajax_get(cptID) {
    var ajaxurl = '/wp-admin/admin-ajax.php';
    jQuery.ajax({
        type: 'POST',
        url: ajaxurl,
        data: {"action": "load-all-filter", cat: cptID },
        success: function(response) {
            jQuery("#category-post-content").html(response);
            return false;
        }
    });
}
jQuery( "a.ajax" ).click(function(e) {
    jQuery("a.ajax").removeClass("current");
    jQuery(this).addClass("current"); //adds class current to the category menu
    var catnumber = jQuery(this).attr('data-term-number');
    cat_ajax_get(catnumber);
    e.preventDefault();
});
jQuery( "a.all-cats" ).click(function(e) {
    jQuery("a.ajax").removeClass("current");
    jQuery(this).addClass("current"); //adds class current to the category menu
    var cptname = jQuery(this).attr('data-cpt-name');
    all_cats_ajax_get(cptname);
    e.preventDefault();
});

//TEAM ajax Members filtering
add_action( 'wp_ajax_nopriv_load-filter', 'prefix_load_cat_posts' );
add_action( 'wp_ajax_load-filter', 'prefix_load_cat_posts' );
function prefix_load_cat_posts () {
    $cat_id = $_POST[ 'cat' ];
    $args = array (
            'tax_query' => array(
                 array(
                    'taxonomy' => 'team_location',
                    'field' => 'term_id',
                    'terms' => array( $cat_id )
                 )
            ),
            'post_type' => 'team-member', // <== this was missing
            'posts_per_page' => 20,
            'order' => 'ASC',
            'orderby'   => 'title',

        );
    global $post;
    $posts = get_posts( $args );
    ob_start ();
    foreach ( $posts as $post ) { 
        setup_postdata($post);
    ?>
    <div class="col-md-6 col-lg-4 space30">
    <div class="project-tile">
        <a href="<?php the_permalink(); ?>"> <?php echo get_the_post_thumbnail( $page->ID, 'large' ); ?></a>
        <div class="project-text">
            <h3 class="posttitle">
                <?php echo get_the_title(); ?>
            </h3>
            <h4>
                <?php the_field('team_title'); ?>
            </h4>
        </div>
    </div> 
    </div> 
   <?php } wp_reset_postdata();
   $response = ob_get_contents();
   ob_end_clean();
   echo $response;
   die(1);
}

//TEAM ajax ALL projects filtering
add_action( 'wp_ajax_load-all-filter', 'prefix_load_all_cat_posts' );
function prefix_load_all_cat_posts () {
    $cat_id = $_POST[ 'cat' ];
    $args = array (
            'post_type' => 'team-member',
            'posts_per_page' => 20,
            'order' => 'ASC',
            'orderby'   => 'ID',
        );
    global $post;
    $posts = get_posts( $args );
    ob_start ();
    foreach ( $posts as $post ) { 
        setup_postdata($post);
    ?>
    <div class="col-md-6 col-lg-4 space30">
    <div class="project-tile ">
        <a href="<?php the_permalink(); ?>"> <?php echo get_the_post_thumbnail( $page->ID, 'large' ); ?></a>
        <div class="project-text">
            <h3 class="posttitle">
                <?php echo get_the_title(); ?>
            </h3>
            <h4>
                <?php the_field('team_title'); ?>
            </h4>
        </div>
    </div> 
    </div> 
   <?php } wp_reset_postdata();
   $response = ob_get_contents();
   ob_end_clean();
   echo $response;
   die(1);
}

Upvotes: 0

Views: 3323

Answers (2)

Adrian Mbugua
Adrian Mbugua

Reputation: 1

Check ii your host has ModSecurity enabled, disable it and give it a try.worked for me

Upvotes: 0

bhanu
bhanu

Reputation: 1860

I think the way you are getting your ajax URL here : https://gist.github.com/chadamski/410f9deb4c9d7bfe51beef5720c5991d#file-ajaxcptfilter-txt-L42 is wrong.

Use on of the two options.

Option 1

In your header add this:

<script type="text/javascript">
    var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
</script>

Now use this ajaxurl in your ajax request.

Option 2

Use script localization.

wp_localize_script( 'FrontEndAjax', 'ajax', array(
    'url' => admin_url( 'admin-ajax.php' )
) );

Here FrontEndAJAX has to be replaced with name of your js file where the ajax code is written.

If set correctly, you can get your url as : ajax.url

Fix action

I am not sure if you are running this on the frontend or just the admin area. If its on the frontend you need to add this.

add_action( 'wp_ajax_load-all-filter', 'prefix_load_all_cat_posts' );
add_action( 'wp_ajax_nopriv_load-all-filter', 'prefix_load_all_cat_posts' );

here : https://gist.github.com/chadamski/410f9deb4c9d7bfe51beef5720c5991d#file-ajaxcptfilter-txt-L117

References:

  1. https://codex.wordpress.org/AJAX_in_Plugins

Upvotes: 0

Related Questions