Pagination now works by first, prev, next, last.

Still need to get number based pagination working.
This commit is contained in:
George Stephanis 2015-08-07 16:58:42 -04:00
parent cf59aec17d
commit 7bebbaff9e
2 changed files with 42 additions and 17 deletions

View File

@ -8,7 +8,8 @@
var rowTemplate = wp.template( 'wc-tax-table-row' ),
paginationTemplate = wp.template( 'wc-tax-table-pagination' ),
$tbody = $('#rates');
$tbody = $('#rates' ),
$pagination = $( '#rates-pagination' );
/**
* Build the table contents.
@ -42,24 +43,48 @@
}
/**
* Handle the initial display.
* Renders table contents by page.
*/
if ( data.rates.length <= data.limit ) {
renderTableContents( data.rates );
} else {
var first_index = data.limit * ( data.page - 1),
last_index = data.limit * data.page;
function renderPage( page_num ) {
var qty_pages = Math.ceil( data.rates.length / data.limit );
page_num = parseInt( page_num, 10 );
if ( page_num < 1 ) {
page_num = 1;
} else if ( page_num > qty_pages ) {
page_num = qty_pages;
}
var first_index = data.limit * ( page_num - 1),
last_index = data.limit * page_num;
renderTableContents( data.rates.slice( first_index, last_index ) );
// We've now displayed our initial page, time to render the pagination box.
$('#rates-pagination' ).html( paginationTemplate( {
qty_rates : data.rates.length,
current_page : data.page,
qty_pages : Math.ceil( data.rates.length / data.limit )
} ) );
if ( data.rates.length > data.limit ) {
// We've now displayed our initial page, time to render the pagination box.
$pagination.html( paginationTemplate( {
qty_rates : data.rates.length,
current_page : page_num,
qty_pages : qty_pages
} ) );
}
}
/**
* Handle the initial display.
*/
renderPage( data.page );
/**
* Handle clicks on the pagination links.
*
* Abstracting it out here instead of re-running it after each render.
*/
$pagination.on( 'click', 'a', function(event){
event.preventDefault();
renderPage( $( event.currentTarget ).data('goto') );
} );
$('.wc_tax_rates .remove_tax_rates').click(function() {
if ( $tbody.find('tr.current').length > 0 ) {
var $current = $tbody.find('tr.current');

View File

@ -173,11 +173,11 @@ wp_enqueue_script( 'wc-settings-tax' );
<span class="displaying-num"><?php printf( _x( '%s items', '%s will be a number eventually, but must be a string for now.', 'woocommerce' ), '{{ data.qty_rates }}' ); ?></span>
<span class="pagination-links">
<a class="tablenav-pages-navspan">
<a class="tablenav-pages-navspan" data-goto="1">
<span class="screen-reader-text"><?php esc_html_e( 'First page', 'woocommerce' ); ?></span>
<span aria-hidden="true">&laquo;</span>
</a>
<a class="tablenav-pages-navspan">
<a class="tablenav-pages-navspan" data-goto="<# print( parseInt( data.current_page, 10 ) - 1 ) #>">
<span class="screen-reader-text"><?php esc_html_e( 'Previous page', 'woocommerce' ); ?></span>
<span aria-hidden="true">&lsaquo;</span>
</a>
@ -189,11 +189,11 @@ wp_enqueue_script( 'wc-settings-tax' );
'<span class="total-pages">{{ data.qty_pages }}</span>' ); ?>
</span>
<a class="tablenav-pages-navspan">
<a class="tablenav-pages-navspan" data-goto="<# print( parseInt( data.current_page, 10 ) + 1 ) #>">
<span class="screen-reader-text"><?php esc_html_e( 'Next page', 'woocommerce' ); ?></span>
<span aria-hidden="true">&rsaquo;</span>
</a>
<a class="tablenav-pages-navspan">
<a class="tablenav-pages-navspan" data-goto="{{ data.qty_pages }}">
<span class="screen-reader-text"><?php esc_html_e( 'Last page', 'woocommerce' ); ?></span>
<span aria-hidden="true">&raquo;</span>
</a>