How do I filter posts by taxomony using AJAX

I found this post that describes how to filter category posts with Ajax and it works great, but I also want to filter my custom taxonomies the same way and I can’t get it to work. It shows me all posts instead of just the posts from my taxonomy.

I know the menu needs to be changed to get_the_terms instead of get_the_categories but I specifically need help with what to change in the jQuery function and the php function at the bottom. I tried adding a tax_query calling my taxonomy but it’s still not showing the correct posts. Can anyone help point me in the right direction?

I figured it out! Here is the code I used:

Add to functions.php:

add_action( 'wp_ajax_nopriv_load-filter2', 'prefix_load_term_posts' );
add_action( 'wp_ajax_load-filter2', 'prefix_load_term_posts' );
function prefix_load_term_posts () {
        $term_id = $_POST[ 'term' ];
            $args = array (
            'term' => $term_id,
            'posts_per_page' => -1,
            'order' => 'DESC',
                 'tax_query' => array(
                  array(
                      'taxonomy' => 'yourtaxonomyhere',
                      'field'    => 'id',
                      'terms'    => $term_id,
                      'operator' => 'IN'
                      )
                  )
             );

        global $post;
        $myposts = get_posts( $args );
        ob_start (); ?>

        <ul class="list">
        <?php foreach( $myposts as $post ) : setup_postdata($post); ?>
            <li><a href="https://wordpress.stackexchange.com/questions/96584/<?php the_permalink(); ?>" id="post-<?php the_ID(); ?>"><?php echo get_post_meta($post->ID, 'image', $single = true); ?></a><br />
             <?php the_title(); ?></li>
       <?php endforeach; ?>
        </ul>

       <?php wp_reset_postdata(); 
       $response = ob_get_contents();
       ob_end_clean();
       echo $response;
       die(1);
}

jQuery script:

<script>
function term_ajax_get(termID) {
    jQuery("a.ajax").removeClass("current");
    jQuery("a.ajax").addClass("current"); //adds class current to the category menu item being displayed so you can style it with css
    jQuery("#loading-animation").show();
    var ajaxurl="http://yourdomain.com/wp-admin/admin-ajax.php";
    jQuery.ajax({
        type: 'POST',
        url: ajaxurl,
        data: {"action": "load-filter2", term: termID },
        success: function(response) {
            jQuery("#category-post-content").html(response);
            jQuery("#loading-animation").hide();
            return false;
        }
    });
}
</script>

I’m not using a function to list the categories, I’m just listing each of them separately. Replace the number with the ID of your term:

<ul class="nav">
     <li id="term-166"><a class="yourtermname ajax" onclick="term_ajax_get('166');" href="#">Your Term Name</a></li>
     <li id="term-354"><a class="yourtermname ajax" onclick="term_ajax_get('354');" href="#">Your Term Name</a></li>
</ul>

Also, if you want to filter tags instead of terms, replace:

• 'term' with 'tag__in',
• $term_id with $tag_id
• and change 'taxonomy' => 'yourtaxonomyhere' to 'taxonomy' => 'post_tag'.