Failed to load resource: the server responded with a status of 500 (Internal Server Error) on AJAX call

I don’t know why this isn’t working. I tried this on my local browser and it works. But when I try to implement this on my live website it gives that error.

Here’s my functions.php

Read More
add_action( 'wp_ajax_get_myposts', 'ajax_get_myposts' );
add_action( 'wp_ajax_nopriv_get_myposts', 'ajax_get_myposts' );

function ajax_get_myposts() {

  $countterms = wp_count_terms( 'item_category' );
  $offset = 4;
  $number = $countterms - $offset;
  $terms = get_terms( 'item_category', array(
      'hide_empty' => true,
      'orderby'    => 'name', 
      'order'      => 'ASC',
      'offset'     => $offset,
      'number'     => $number,
  ) );

  echo '<div class="vc_row wpb_row vc_row-fluid home-category-row">
        <div class="wpb_column vc_column_container vc_col-sm-12">
  '; 

  if($terms) {

    foreach ($terms as $term ) {

      $tid = $term->term_id;
      $name = $term->name;
      $link = get_term_link( $tid );
      $item_cat_id = 'javo_item_category_' .$tid. '_featured';
      $src = wp_get_attachment_image_src( get_option($item_cat_id), array(270,250), false );
      $alt = get_post_meta( get_option($item_cat_id), '_wp_attachment_image_alt', true);

      echo  '

        <div class="wpb_column vc_column_container vc_col-sm-3">
        <div class="wpb_wrapper">
        <div class="category-box">
        <div class="category-box-overlay" style="background:rgba(0,0,0,0.5);"></div>
        <img src="'.$src[0].'" style="" class=" category-box-img ultb3-img-center" alt="'.$alt.'">
        <div class="category-info-box">
        <div class="category-box-title">'.$name.'</div>
        <a href="'.$link.'" class="category-box-btn ultb3-btn">View More<i class="Defaults-angle-right"></i></a>
        </div>
        </div> <!--  custom-category-box -->
        </div> <!--  wpb_wrapper -->
        </div> <!-- wpb_column -->
      ';

     }

  } else {
      echo  '<div>No posts</div>';
  }

   echo '</div></div>';

 wp_die();

}

My Ajax Call

(function($) {

    'use strict';

    var main = {
        init: function() {
            this.myajax();
        },

        myajax: function() {
            $('button.myButton').on('click', function() {
                $.ajax({
                    type: 'POST',
                    url: '/wp-admin/admin-ajax.php',
                    dataType: 'html',
                    data: {
                        action: 'get_myposts'
                    },
                    beforeSend: function() {
                        $('#allpost').append('<img id="ajax-preloader" src="/wp-content/uploads/2016/06/Preloader_10.gif">');
                    },

                    success: function(result) {
                        console.log(result);
                        $('button.myButton').hide();
                        $('#allpost').hide().append(result).fadeIn();
                    },
                    error : function(e) {
                        console.log(e);
                    },

                    complete: function() {
                        $('body').find('#ajax-preloader').remove();
                    }   

                });
            });
        }
    };

    main.init();

})(jQuery);

Is there any one who can suggest me something for my problem.

Related posts

Leave a Reply

2 comments

  1. You receive the response HTTP status code 500. This indicates that a server fault occured. Your client-side javascript code shouldn’t be the problem in this case.

    Please check the differences between your local development environment and your live website (e.g. webserver configuration, php version, …).

  2. I just found a fix. There was something wrong with using the get_term_link function.

    From

    $link = get_term_link( $tid );
    

    To

     $term_link = get_term_link( $term->slug, $term->taxonomy );
    

    That was weird since get_term_link($tid) was working in my local.