Sorting WP Auctions by date/price?

I’m using this plugin called WP Auctions with the List plugin, and as you may have guessed, it is to display a list of auctions on a page much like eBay where users can bid on items. It is simple to set up. I just need to activate it and plug in the shortcode.

The reason why I am having trouble is because I want users to be able to sort the list of auctions by price and date. This is not built into the plugin unfortunately. However, the author did build filters into the shortcode so I can use something like this to organize the list by date:

[wpa_list_widget mode="list" order="date"]

Or I can use something like this to organize the list by price:

[wpa_list_widget mode="list" order="price"]

However, I can’t put both shortcodes onto one page. So my idea was to use jQuery tabs (content via AJAX) and include one shortcode on the page and call the other one through AJAX. However, this doesn’t seem to be working.

Here is how I have the auction page template set up:

<div id="tabs">
  <ul>
    <li><a href="#tabs-1">Order by date</a></li>
    <li><a href="<?php bloginfo('template_url'); ?>/auction_price.php">Order by price</a></li>
  </ul>
  <div id="tabs-1">
    <?php echo do_shortcode('[wpa_list_widget mode="list" order="date"]'); ?>
  </div>
</div>

With this setup, tab 1 shows up fine; however, tab 2 (order by price) shows nothing, and nothing shows up in the HTML as well.

In the above code, you’ll notice that I am trying to call the content from ‘auction_price.php’. Below is how I currently have the ‘auction_price.php’ template set up:

<?php require('./wp-blog-header.php'); ?>
<?php echo do_shortcode('[wpa_list_widget mode="list" order="price"]'); ?>

Just two simple lines. And finally, below is the script that starts it all up:

jQuery(document).ready(function($){
  $(function() {
    $( "#tabs" ).tabs({
       beforeLoad: function( event, ui ) {
          ui.jqXHR.error(function() {
              ui.panel.html(
                "Load fail." );
        });
      }
    });
  });
});

Any help would be massively appreciated!

Solutions Collecting From Web of "Sorting WP Auctions by date/price?"

<a href="<?php bloginfo('template_url'); ?>/auction_price.php">Order by price</a>

auction-price.php is inside the template directory.

Then you can’t include wp-blog-header.php using require(‘./wp-blog-header.php’) inside template directory.

Therefore do_shortcode() is not working without WordPress.

The proper way to use ajax in WordPress is via admin-ajax.php

Read More at Codex:

http://codex.wordpress.org/AJAX_in_Plugins

For example, in your functions.php:

function wpse_77197_auction_price(){
    echo do_shortcode('[wpa_list_widget mode="list" order="price"]');
    die();
}

add_action('wp_ajax_price_action', 'wpse_77197_auction_price');
add_action('wp_ajax_nopriv_price_action', 'wpse_77197_auction_price');

In your template file:

<div id="tabs">
  <ul>
    <li><a href="#tabs-1">Order by date</a></li>
    <li><a href="<?php echo admin_url('admin-ajax.php'); ?>?action=price_action">Order by price</a></li>
  </ul>
  <div id="tabs-1">
    <?php echo do_shortcode('[wpa_list_widget mode="list" order="date"]'); ?>
  </div>
</div>

Update:

Try to handle the ajax request yourself in the “wp” or “init” action as explained in https://wordpress.stackexchange.com/a/53491/19683

add_action( 'init', function() { 
  wpse_77197_register_shortcode_ajax( 'wpse_77197_auction_price', 'price_action' ); 
} );

function wpse_77197_register_shortcode_ajax( $callable, $action ) {

  if ( empty( $_POST['action'] ) || $_POST['action'] != $action )
    return;

  call_user_func( $callable );
}

function wpse_77197_auction_price(){
    echo do_shortcode('[wpa_list_widget mode="list" order="price"]');
    die();
}