7

I have WP_List_Table and i'd to like to add it to a page, and I searched and I have not seen examples on how to do this.Does anyone have a snippet on how I can achieve this?

<?php
/*
Plugin Name: Add Parl Plugin 2
Description: To add parliaments
Plugin URI:"http://www.ttparliaments.org"
Author URI: ""
Author: Napoleon Okunna
License: ""
Version: 1.0
*/


global $custom_table_example_db_version;
$custom_table_example_db_version = '1.1'; // version changed from 1.0 to 1.1
  global $wpdb;
    global $custom_table_example_db_version;

    $table_name = $wpdb->prefix . 'oop_parliamentary_info'; // do not forget about tables prefix


/**
 * PART 2. Defining Custom Table List
 * ============================================================================
 *
 * In this part you are going to define custom table list class,
 * that will display your database records in nice looking table
 *
 * http://codex.wordpress.org/Class_Reference/WP_List_Table
 * http://wordpress.org/extend/plugins/custom-list-table-example/
 */

if (!class_exists('WP_List_Table')) {
    require_once(ABSPATH . 'wp-admin/includes/class-wp-list-table.php');
}
/**
 * Custom_Table_Example_List_Table class that will display our custom table
 * records in nice table
 */
class Custom_Table_Example_List_Table extends WP_List_Table
{
    /**
     * [REQUIRED] You must declare constructor and give some basic params
     */
    function __construct()
    {
        global $status, $page;

        parent::__construct(array(
            'singular' => 'person',
            'plural' => 'persons',
        ));
    }

    /**
     * [REQUIRED] this is a default column renderer
     *
     * @param $item - row (key, value array)
     * @param $column_name - string (key)
     * @return HTML
     */
    function column_default($item, $column_name)
    {
        return $item[$column_name];
    }

    /**
     * [OPTIONAL] this is example, how to render specific column
     *
     * method name must be like this: "column_[column_name]"
     *
     * @param $item - row (key, value array)
     * @return HTML
     */
    function column_age($item)
    {
        return '<em>' . $item['age'] . '</em>';
    }

    /**
     * [OPTIONAL] this is example, how to render column with actions,
     * when you hover row "Edit | Delete" links showed
     *
     * @param $item - row (key, value array)
     * @return HTML
     */
    function column_name($item)
    {
        // links going to /admin.php?page=[your_plugin_page][&other_params]
        // notice how we used $_REQUEST['page'], so action will be done on curren page
        // also notice how we use $this->_args['singular'] so in this example it will
        // be something like &person=2
        /*$actions = array(
            'edit' => sprintf('<a href="?page=persons_form&id=%s">%s</a>', $item['id'], __('Edit', 'custom_table_example')),
            'delete' => sprintf('<a href="?page=%s&action=delete&id=%s">%s</a>', $_REQUEST['page'], $item['id'], __('Delete', 'custom_table_example')),
        );

        return sprintf('%s %s',
            $item['Title'],
            $this->row_actions($actions)
        );
        */

  $actions = array(
            'edit'      => sprintf('<a href="?page=%s&action=%s&book=%s">Edit</a>',$_REQUEST['page'],'edit',$item['ParliamentaryID']),
            'delete'    => sprintf('<a href="?page=%s&action=%s&book=%s">Delete</a>',$_REQUEST['page'],'delete',$item['ParliamentaryID']),
        );

  return sprintf('%1$s %2$s', $item['booktitle'], $this->row_actions($actions) );
    }

    /**
     * [REQUIRED] this is how checkbox column renders
     *
     * @param $item - row (key, value array)
     * @return HTML
     */
    function column_cb($item)
    {
        return sprintf(
            '<input type="checkbox" name="id[]" value="%s" />',
            $item['id']
        );
    }

    /**
     * [REQUIRED] This method return columns to display in table
     * you can skip columns that you do not want to show
     * like content, or description
     *
     * @return array
     */
    function get_columns()
    {
        $columns = array(
            'cb' => '<input type="checkbox" />', //Render a checkbox instead of text
            'Title' => __('Title', 'custom_table_example'),
            'StartDate' => __('StartDate', 'custom_table_example'),
            'EndDate' => __('EndDate', 'custom_table_example'),
             'IsCurrent' => __('IsCurrent', 'custom_table_example'),
            // 'ParliamentaryID' => __('Edit', 'custom_table_example','<input type="checkbox" />'),
             ParliamentaryID =>'<a href=#>Edit</a>',

        );
        return $columns;
    }

    /**
     * [OPTIONAL] This method return columns that may be used to sort table
     * all strings in array - is column names
     * notice that true on name column means that its default sort
     *
     * @return array
     */
    function get_sortable_columns()
    {
        $sortable_columns = array(
            'Title' => array('Title', true),
            'StartDate' => array('StartDate', false),
            'EndDate' => array('EndDate', false),
             'IsCurrent' => __('IsCurrent', false),
             'ParliamentaryID'=> __('ParliamentaryID', false),

        );
        return $sortable_columns;
    }

    /**
     * [OPTIONAL] Return array of bult actions if has any
     *
     * @return array
     */
    function get_bulk_actions()
    {
        $actions = array(
            'delete' => 'Delete',
            'edit' =>'Edit'
        );
        return $actions;
    }

    /**
     * [OPTIONAL] This method processes bulk actions
     * it can be outside of class
     * it can not use wp_redirect coz there is output already
     * in this example we are processing delete action
     * message about successful deletion will be shown on page in next part
     */
    function process_bulk_action()
    {
        global $wpdb;
        $table_name = $wpdb->prefix . 'cte'; // do not forget about tables prefix

        if ('delete' === $this->current_action()) {
            $ids = isset($_REQUEST['id']) ? $_REQUEST['id'] : array();
            if (is_array($ids)) $ids = implode(',', $ids);

            if (!empty($ids)) {
                $wpdb->query("DELETE FROM $table_name WHERE id IN($ids)");
            }
        }
        if ('Edit' === $this->current_action()) {
            echo('Edit');
        }
    }

    /**
     * [REQUIRED] This is the most important method
     *
     * It will get rows from database and prepare them to be showed in table
     */
    function prepare_items()
    {
        global $wpdb;
        $table_name = $wpdb->prefix . 'cte'; // do not forget about tables prefix
         $table_name='oop_parliamentary_info';

        $per_page = 5; // constant, how much records will be shown per page

        $columns = $this->get_columns();
        $hidden = array();
        $sortable = $this->get_sortable_columns();

        // here we configure table headers, defined in our methods
        $this->_column_headers = array($columns, $hidden, $sortable);

        // [OPTIONAL] process bulk action if any
        $this->process_bulk_action();

        // will be used in pagination settings
        $total_items = $wpdb->get_var("SELECT COUNT(ParliamentaryID) FROM $table_name");

        // prepare query params, as usual current page, order by and order direction
        $paged = isset($_REQUEST['paged']) ? max(0, intval($_REQUEST['paged']) - 1) : 0;

        $orderby = (isset($_REQUEST['orderby']) && in_array($_REQUEST['orderby'], array_keys($this->get_sortable_columns()))) ? $_REQUEST['orderby'] : 'name';
        $order = (isset($_REQUEST['order']) && in_array($_REQUEST['order'], array('asc', 'desc'))) ? $_REQUEST['order'] : 'asc';



        // [REQUIRED] define $items array
        // notice that last argument is ARRAY_A, so we will retrieve array
        $this->items = $wpdb->get_results($wpdb->prepare("SELECT Title,StartDate,EndDate,ParliamentaryID  FROM oop_parliamentary_info  ", $per_page, $paged), ARRAY_A);
       // $this->items = $wpdb->get_results($wpdb->prepare("SELECT Title,StartDate,EndDate FROM oop_parliamentary_info   ORDER BY $orderby $order LIMIT 100 OFFSET 10 ", $per_page, $paged), ARRAY_A);
        //echo(serialize($this->.);
        //$this->column_name("StartDate");
        //loop thorough this and fpormat 
        foreach ($this->items as $item ) {
                 static $row_class = '';
                   $row_class = ( $row_class == '' ? ' class="alternate"' : '' );

               echo '<tr' . $row_class . '>';
              // $this->single_row_columns( $item );
               echo '</tr>';
        }
        // [REQUIRED] configure pagination
        $this->set_pagination_args(array(
            'total_items' => $total_items, // total items defined above
            'per_page' => $per_page, // per page constant defined at top of method
            'total_pages' => ceil($total_items / $per_page) // calculate pages count
        ));
    }


     function single_row_columns($item) {
       list($columns, $hidden) = $this->get_column_info();
            foreach ($columns as $column_name => $column_display_name) {
                   $class = "class='$column_name column-$column_name'";

                   $style = '';
                   if (in_array($column_name, $hidden))
                         $style = ' style="display:none;"';

                   $attributes = "$class$style";

                   if ('cb' == $column_name) {
                   echo  "<td $attributes>";
                  // echo '<input type="checkbox" name="id[]" value="%s" />', $item['ID'];
                   echo "</td>";
                        }
               elseif ('ParliamentaryID' == $column_name) {
               echo "<td $attributes>";
              //echo '<a href="#">', $item['ParliamentaryID'];
               echo '<a href="#">', '';
               echo "</a>";

                   echo "<div class='row-actions'><span class='edit'>";
           echo sprintf('<a class="editParlRow"  href="?page=%s&action=%s&gid=%s">Edit</a>',$_REQUEST['page'],'edit',$item['ParliamentaryID']);
                   echo "</span> | <span class='trash'>";
           echo sprintf('<a href="?page=%s&action=%s&gid=%s">Delete</a>',$_REQUEST['page'],'delete',$item['ParliamentaryID']);
           echo "</span></div></td>";
                                                    }
            else {
                echo "<td $attributes>";
                echo $this->column_default( $item, $column_name );
                echo "</td>";
            } } } 

}
  • What page are you adding this to? In the admin section of the site or on a custom page? Do you want to be able to filter the results or just list content? Can you also show where you are getting the data to populate your tables? – jgraup Dec 17 '15 at 20:42
  • I got it work on an admin page but i'd like to get this to work on a custom page or any page at all – Napstar Dec 17 '15 at 20:47
  • This looks like an internal feature - "While WP_List_Table was designed for internal usage and didn’t make many considerations for custom subclasses, we recognize that developers use them and that clean up would benefit both implementations and future maintenance. " - make.wordpress.org/core/2015/08/08/list-table-changes-in-4-3 Are you just trying to list column data on the front-end? – jgraup Dec 17 '15 at 20:52
  • There are quite a few jQuery Table plugins unheap.com/section/user-interface/filter-sort & unheap.com/section/media/tables-graphs for example – jgraup Dec 17 '15 at 21:00
  • @jgraup yes,I' trying to list column data on the front-end – Napstar Dec 17 '15 at 21:10
8

Your WP_List_Table will be different -- this was adapted from WP_List_Table – a step by step guide and using the GIST: Sample plugin for usage of WP_List_Table class (complete version). You'll want to adjust your methods to include CSS on the front-end as well (not included in this answer).

WARNING :

Since this class is marked as private, developers should use this only at their own risk as this class is subject to change in future WordPress releases. Any developers using this class are strongly encouraged to test their plugins with all WordPress beta/RC releases to maintain compatibility.

PREP THE FRONT-END

add_action ('init', function(){

   // If we're not in back-end we didn't expect to load these things

   if( ! is_admin() ){

       require_once( ABSPATH . 'wp-admin/includes/class-wp-list-table.php' );
       require_once( ABSPATH . 'wp-admin/includes/screen.php' );
       require_once( ABSPATH . 'wp-admin/includes/class-wp-screen.php' );
       require_once( ABSPATH . 'wp-admin/includes/template.php' );

       global $myListTable;
       $myListTable = new My_Example_List_Table();
   }
});

RENDER

function my_render_list_page(){

    global $myListTable;

    echo '</pre><div class="wrap"><h2>My List Table Test</h2>';
    $myListTable->prepare_items();

    ?>
    <form method="post">
        <input type="hidden" name="page" value="ttest_list_table">
    <?php

        $myListTable->search_box( 'search', 'search_id' );
        $myListTable->display();

    echo '</form></div>';
}

ON YOUR PAGE

my_render_list_page();

CONDENSED VERSION

function my_render_list_page(){

    static $myListTable;
    if( ! isset($myListTable)) {
        require_once(ABSPATH . 'wp-admin/includes/class-wp-list-table.php');
        require_once(ABSPATH . 'wp-admin/includes/screen.php');
        require_once(ABSPATH . 'wp-admin/includes/class-wp-screen.php');
        require_once(ABSPATH . 'wp-admin/includes/template.php');
        $myListTable = new My_Example_List_Table();
    }

    echo '</pre><div class="wrap"><h2>My List Table Test</h2>';
    $myListTable->prepare_items();

?>
<form method="post">
    <input type="hidden" name="page" value="ttest_list_table">
<?php

    $myListTable->search_box('search', 'search_id');
    $myListTable->display();

    echo '</form></div>';
}
  • This way you are loading (very early) the 4 files in all frontend request, event for the pages that does not uses the my_render_list_page() function. Why don't require the file and instantiate the class inside the my_render_list_page() function? This makes code more simpler, more readable and globals free... – gmazzap Dec 19 '15 at 0:30
  • Good point @gmazzap – jgraup Aug 24 '16 at 20:03
  • @jgraup Thank you for this. It works. I do have an error notice that shows up though: Notice: Undefined index: hook_suffix in \wp-admin\includes\class-wp-screen.php on line 213 – samjco 23 hours ago

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.