Add the category ID to category list items <div class="category-block" data-cid="{ID-OF-CAT}">
, you will need it in the ajax request. You must also include action
in the request and display received data.
Here you can read more about AJAX in WP.
blog.js
(function($) {
$(document).ready(function() {
var cat_buttons = $(".category-block");
cat_buttons.on( 'click', function(event){
//
event.preventDefault();
var cid = $(this).data('cid');
$.ajax({
type: "POST",
url: ajaxposts.ajaxurl,
data: {
action: 'my_action_name',
cat_id: cid // <-- category ID of clicked item / link
}
})
.done( function(data){
// display posts
});
});
});
})(jQuery);
You need also PHP function to handle the AJAX request:
functions.php
add_action( 'wp_ajax_my_action_name', 'ajx_handle_my_action' );
add_action( 'wp_ajax_nopriv_my_action_name', 'ajx_handle_my_action' );
function ajx_handle_my_action() {
$category_id = (int)$_POST['cat_id'];
//
// read category posts
echo json_encode( $result );
wp_die();
}