My Portfolio
WordPress, PHP, Html, jQuery, CodeIgnitor, ReactJS, AWS, Rest API and Design
A simple AJAX posts filtering working under AJAX. Easy to modify and Simple AJAX posts filter by category and publish date for WordPress
//wordpress-ajax
function.php
function ajax_customize_init(){
wp_register_script('ajax-customize-script', get_stylesheet_directory_uri() . '/assets/js/ajax-customize-script.js', array('jquery') );
wp_enqueue_script('ajax-customize-script');
wp_localize_script( 'ajax-customize-script',
'ajax_customize_object',
array(
'ajaxurl' => admin_url( 'admin-ajax.php' ),
'loadingmessage' => __('Please wait...')
));
add_action( 'wp_ajax_nopriv_customize_home_search', 'customize_home_search' );
add_action( 'wp_ajax_customize_home_search', 'customize_home_search' );
}
add_action('init', 'ajax_customize_init');
function customize_home_search(){
$args = array(
'post_type' => 'post',
's' => $_POST['solution'],
'post_status' => 'publish',
'orderby' => 'title',
'order' => 'ASC',
'posts_per_page' => 5
);
$return = array();
$return['status'] = false;
$return['message'] = 'No result found!';
$wp_query = new WP_Query($args);
if(count($wp_query) > 0){
$return['status'] = true;
$return['message'] = 'Result found!';
}
if( $wp_query->have_posts() ):
$return['data'] = '<ul>';
while( $wp_query->have_posts() ): $wp_query->the_post();
$return['data'] .= '<li><a href="'.get_the_permalink().'" >'.get_the_title().'</a></li>';
endwhile;
$return['data'] .= '<ul>';
endif;
wp_reset_postdata();
echo json_encode($return);
die;
}
//ajax-customize-script.js
jQuery(document).ready(function($) {
// Perform AJAX login on form submit
//$('#customize_home_search').on('click', function(e) {
$("form#customize_home_search").submit(function(e) {
e.preventDefault();
var solution = $("#select_solution").val();
//$('.customize_partner_details p.status').show().text(ajax_login_object.loadingmessage);
$('#search_render_model').show().slideDown(500);
$('#search_render_model').html('<span class="loading">'+ajax_customize_object.loadingmessage+'</span>');
$.ajax({
type: 'POST',
dataType: 'json',
url: ajax_customize_object.ajaxurl,
data: {
'action': 'customize_home_search',
'solution': solution
},
success: function(response) {
if(response.status == true){
$('#search_render_model').html(response.data);
}else{
$('#search_render_model').html(response.message);
}
}
});
});
});
//close click on out side
jQuery(document).mouseup(function(e)
{
var container = jQuery("#search_render_model");
// if the target of the click isn't the container nor a descendant of the container
if (!container.is(e.target) && container.has(e.target).length === 0)
{
container.hide();
}
});