jQuery.ajax({
  url: mySolrUrl,
  data: myQueryParameters,
  success: mySuccessCallback,
  dataType: 'jsonp',
  jsonp: 'json.wrf'
});

Of course, for this to work the Solr server you’re accessing needs to be publicly accessible, which probably isn’t ideal for security.

We’ll use here a simlarly contrived example. Let’s say you use <!--more--> in your longer posts so they don’t fill up too much of your page. Normally, clicking the “Read more…” (or whatever text you use) link takes the user to a separate page with the complete post. In our example, rather than sending the reader to a new page, we’ll make an Ajax request to get the rest of the post and insert it directly into the current page.

Step 1: A Standard WordPress Template

Somewhere in your template, you’ll find a section like:

<div class="entry">
  < ?php the_content('Read more...'); ?>
</div>

This displays the contents of your post, with the “Read more…” link at the end to read whatever was cut off by <!--more-->. Pretty simple.

Step 2: Get the Full Post

Now it’s time to start writing our plugin. We’ll call it “Post Expander”, so our plugin file will be called post-expander.php.

We need a function that will return just the contents of a post. For example:

function post_expander_show_post (  ) {
  if ( have_posts() ) {
    while ( have_posts() ) {
      the_post();
      the_content('Read more...');
    }
  }
  die();
}

This function will take advantage of the WordPress loop, printing out just the contents of the post before dying.

So how and when do we call this function? First, we use the init hook to see if the requested posted our special post_expander variable.

function post_expander_activate ( ) {
  if ( isset( $_POST["post_expander"] ) ) {
    add_action( 'wp', 'post_expander_show_post' );
  }
}
 
add_action('init', 'post_expander_activate');

If the variable is set, we attach post_expander_show_post to the wp hook, which runs after posts are loaded but before any templates are executed. Now, if a page is requested with the post_expander variable posted, this plugin will intercept the request.

Step 3: Write the JavaScript Function

So we need a JavaScript function to post that request and insert the full post into the page. We’ll put that code in post-expander.js.

jQuery(document).ready( function($) {
  $(".more-link").click( function() {
    var link = $(this);
    $.post(link.attr("href"), {
        post_expander: 1
      }, function(data) {
        link.parents(".entry").html($(data));
      }
    );
    return false;
  });
});

Pretty simple JavaScript, that. (NB: link.parents(".entry") makes the assumption that the body of your post is in a div with the class entry.)

Step 4: Load Your JavaScript into the Page

Just a bit of housekeeping left, now. We need to load our JavaScript into the page, taking care to mention that it requires jQuery.

function post_expander_list_scripts ( ) {
  wp_enqueue_script( "post-expander", path_join(WP_PLUGIN_URL, basename( dirname( __FILE__ ) )."/post-expander.js"), array( 'jquery' ) );
}
 
add_action('wp_print_scripts', 'post_expander_list_scripts');

Once again, this plugin is not entirely practical, but you’re welcome to download the full code.

Step 1: Build the Admin Page

Zipping right by the details of how to add an admin page, here’s the code for adding our category list as a management page.

In category-list.php:

?php
/*
Plugin Name: Category List
Description: A list of categories.
Author: Jonathan Brinley
Author URI: http://xplus3.net/
*/
function category_list_add_management_page(  ) {
  if ( function_exists('add_management_page') ) {
    $page = add_management_page( 'Category List', 'Category List', 'manage_categories', 'category_list', 'category_list_admin' );
  }
}
 
function category_list_admin(  ) {
  $categories = get_categories( 'orderby=name&hierarchical=0&hide_empty=0' );
  include_once('category_list_view.php');
}
 
add_action('admin_menu', 'category_list_add_management_page');

In category-list-view.php:

<div class="wrap">
  <h2>Category List</h2>
  <ul id="category_list">
  < ?php foreach ( $categories as $cat ): ?>
    <li id="cat-<?php echo $cat->cat_ID; ?>" class="category-name"><a href="#">< ?php echo $cat->cat_name; ?></a></li>
  < ?php endforeach; ?>
  </ul>
</div>

Step 2: Add the Ajax Response

As mentioned above, clicking on a category will fetch a list of post titles. So we need a function that builds that list. We’ll add this function to category_list.php:

function category_list_posts(  ) {
  $catID = isset($_POST['catID'])?$_POST['catID']:null;
  if ( $catID ) {
    $posts = get_posts( "numberposts=-1&post_status=publish,pending,future,private,draft&category=$catID" );
    include_once('posts_list_view.php');
  }
  die;
}

And, of course, we need posts_list_view.php:

<ul class="posts_list">
< ?php foreach ( $posts as $post ): ?>
  <li class="post-name post-<?php echo $post->ID; ?>">< ?php echo $post->post_title; ?></li>
< ?php endforeach; ?>
</ul>

We also need to tell WordPress when to call this function, using another action hook:

add_action('wp_ajax_category_list_posts', 'category_list_posts' );

Whenever you post a request to wp-admin/admin-ajax.php with the action parameter of category_list_posts (this being everything after “wp_ajax_” in the action hook), WordPress will call category_list_posts(), the function named in the second parameter of add_action.

Note the call to die at the end of category_list_posts(). When responding to Ajax requests, WordPress will end the response by calling die('0'). If you don’t want that “0″ to appear at the end of your response, you have to call die before WordPress gets a chance.

Step 3: Write Your JavaScript

You have your list of categories, and your function that will return the list of posts in a category. Now you need some JavaScript to put them together.

Remember that the Ajax request needs to be sent to wp-admin/admin-ajax.php. Without knowing what directory your plugin will be installed in, nor the full path to wp-admin, you need to provide the URL to your JavaScript somehow. The easiest way I see it to change the href attribute of your links to that URL. So in category_list_view.php, well replace the opening anchor tag with:

<a href="<?php bloginfo('wpurl'); ?>/wp-admin/admin-ajax.php"></a>

With that, we can create a simple JavaScript file (we’ll call it category_list.js):

jQuery(document).ready( function($) {
  $("li.category-name a").click( function() {
    var li = $(this).parent();
 
    /* only fetch results once */
 
    $(this).unbind('click').bind('click', function(){return false;});
 
    $.post($(this).attr("href"), {
        action: "category_list_posts",
        catID: li.attr("id").substr(4)
      }, function(data) {
        li.append($(data));
      }
    );
    return false;
  });
});

This posts data to the given URL, and appends the response to the end of the li.

Now we just need to tell WordPress to include the JavaScript when we’re on the Category List page. Back up in category_list_add_management_page, we’ll make use of that $page variable we set up earlier. Add a line after that:

add_action("admin_print_scripts-$page", 'category_list_scripts');

And add the category_list_scripts function to specify which scripts to add:

function category_list_scripts(  ) {
  wp_enqueue_script( "category-list", path_join(WP_PLUGIN_URL, basename( dirname( __FILE__ ) )."/category_list.js"), array( 'jquery' ) );
}

This plugin doesn’t really do anything useful, but if you want to see the full source code, you’re welcome to download it.