Wordpress admin-ajax.php 400 加载失败

Question

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); }

Answer 1

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