I am trying to show data associated with selected categories by using ajax. Its working only for the last term selected, not for all the selected terms. Any help would be highly appreciated.

var selected_cat = $('#my-categorychecklist input:checked').map(function() {
    return this.value

   $(document).ready( function () {
         var getid = $('#my-categorychecklist input:checked').last().val();
         var matchid = $('#my-categorychecklist input:checked').last().val();

         $('#section').html('<div class="spinner"></div>');
         var data = {
             'action': 'fields_selected',
             'post_id': $('#fields-list-selected').data('post_id'),
             'term_id': selected_cat

             $.post(ajaxurl, data, function (response) {
                     if(response != 0) {
                     } else {
                         $('.block'+getid).html(" ");

    $args = null;
    if (!empty($term_ids)){ //terms ids
        foreach($term_ids as $term_id){
            $args = array(
                'post_type'      => 'my_post',
                'posts_per_page' => -1,
                'meta_query'    => array(
                    'relation' => 'AND',
                        'key'       => 'category',
                        'value'     => $term_id,
                        'compare'   => 'EXISTS',
                        'key'       => 'associate',
                        'value'     => 'categories',
                        'compare'   => 'LIKE',
            $query = new WP_Query( $args );
            if ($query->have_posts()){

                // Start the Loop
                global $post;
                // Process output

                include MY_TEMPLATES_DIR . 'custom-field.php';
                wp_reset_postdata(); // Restore global post data stomped by the_post()
                $output = ob_get_clean();

                print $output;

                if( $ajax ) {
            } else{
                // Process empty output
                $output = ob_get_clean();
                print $output;
                //print "No data found !";
    }/*AJAX CALLBACK END*/if ($term_id_selected) {
        foreach ($term_id_selected as $single_term){
        <div id="fields-list-selected" data-post_id="<?php echo $post_ID; ?>">
            do_action('wp_ajax_fields_selected', $post_ID, $single_term); ?>
  • Can you please add the code of your PHP function that is handling the request? Commented Feb 10, 2019 at 10:20
  • @BorisKuzmanov --I have edited my code. Please check.
    – Rafiq
    Commented Feb 10, 2019 at 11:01

1 Answer 1


Your code has

 var getid = $('#my-categorychecklist input:checked').last().val();

see the .last(), that's why you're only getting the last item Also, why do you have the same thing in getid and matchid?

You need to store the selected categories in an array and loop through them, try something like:

var selected_cats = $('#my-categorychecklist input:checked').map(function() {
    return this.value

(without the .get()) then loop through them with

    selected_cats.forEach(function(element) {
      //make sure element has what you're expecting then do you something on element

Try doing console.log() on each variable and see in your console, if the the variables have the result you're expecting. Make sure that selected_cats has an array of the selected categories

  • I have looped it through for but still printing the last one. like that---- var i; var numberOfTermSelected = termID.length; for (i = 0; i<numberOfTermSelected; i++ ){ }
    – Rafiq
    Commented Feb 11, 2019 at 13:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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