How to use wordpress functions in an ajax call

WordPress provides an Ajax Url that you should use along with a complete Ajax API.

You need to create a jQuery function.

Example:

jQuery(document).ready(function($) {    var data = {        action: 'my_action',        whatever: 1234    };    jQuery.post(ajaxurl, data, function(response) {        alert('Got this from the server: ' + response);    });});

The ajaxurl var is always available on the admin side. If your using it on the front end you need to define it.

Then a PHP function where you can run your query. The PHP function must get attached to the wp_ajax_your_action action.

Example:

add_action('wp_ajax_my_action', 'my_action_callback');function my_action_callback() {    global $wpdb; // this is how you get access to the database    $whatever = intval( $_POST['whatever'] );    $whatever += 10;        echo $whatever;    die(); // this is required to return a proper result}

The wp_ajax_your_action action is for admin if you need to use it on the front end the action would be wp_ajax_nopriv_your_action

I highly recommend the JSON API plugin: http://wordpress.org/extend/plugins/json-api/. It provides a RESTful interface for the most common WordPress functions including query_post and allows you to add your own actions.

You have to create you function in your themes functions.phpHere is the example for load popular posts using ajax

function getPopularPosts(){    $popularpostdata = wpp_get_mostpopular_data();    foreach($popularpostdata as $populardata)        {            $cur_id = $populardata->id;            $cur_date = $populardata->post_date;            $cur_date = date("F j, Y", strtotime($cur_date));    ?>    <article id="<?php echo $populardata->post_slug.'_mp';?>" data-attr-post-title="<?php echo $populardata->title; ?>" <?php post_class(); ?>>      <p class="advt_disclosure"><?php echo advtdescloser(); ?></p>      <?php         echo '<h6>'.getCategoryLink().'</h6>';        $post_mp = get_post($cur_id);      ?>      <h1><?php echo $populardata->title;?></h1>      <div class="entry-content">        <div class="post-details"> <?php echo getAuthorData($post_mp->post_author,$cur_id,$populardata->title,$cur_date); ?> </div>        <div class="collapsediv">          <div class="row">            <div class="col-sm-9 post_article">              <?php                    $content = $populardata->postcontent; //$content_post->post_content;                    $content = apply_filters('the_content', $content);                    $content = str_replace(']]>', ']]>', $content);                    echo $content;                    wp_link_pages( array(                        'before'      => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>',                        'after'       => '</div>',                        'link_before' => '<span>',                        'link_after'  => '</span>',                        'pagelink'    => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%',                        'separator'   => '<span class="screen-reader-text">, </span>',                    ) );                 ?>              <p class="tags"> TAGS: <?php echo get_the_tag_list( '', __( ', ', 'twentyfifteen' ) )?></p>            </div>            <div class="col-sm-3 hot_deal"> <?php echo getAdvertisements(); ?> </div>            <div class="col-sm-12 comment_section"> <?php echo getPostCommentsandSocialmediasharing($post_mp->post_author,$cur_id,$populardata->title); ?> </div>          </div>        </div>      </div>      <footer class="entry-footer">        <?php //twentyfifteen_entry_meta(); ?>        <?php //edit_post_link( __( 'Edit', 'twentyfifteen' ), '<span class="edit-link">', '</span>' ); ?>      </footer>      <div class="expander">        <button class="expand" data-text-swap="Close article">expand article</button>      </div>    </article>    <?php }    exit();}add_action('wp_ajax_getPopularPosts', 'getPopularPosts');add_action('wp_ajax_nopriv_getPopularPosts', 'getPopularPosts');`And for call ajax you need to put some where in your themes footer.php`$(".popular_posts").click(function(e) {                    e.preventDefault();                    if($('.popularposts').html().length==0)                    {                        $('.popularposts').html('<p class="text-center" style="margin-top:40px;"><img src="<?php echo get_home_url(); ?>/wp-content/themes/twentyfifteen/images/ajax-loader.gif"></p>');                        $.ajax({                            type: 'POST',                            url: "<?php echo get_home_url(); ?>/wp-admin/admin-ajax.php",                            data: {                                action: 'getPopularPosts'                            },                            success: function( data ) {                                $('.popularposts').html(data);                            }                        });                    }                });