Add in and populate pagination template.
The buttons don’t actually do anything yet, but it outputs accurately and inherits core styles.
This commit is contained in:
parent
f541093dce
commit
ba1d2d7bde
|
@ -7,6 +7,7 @@
|
|||
$(function() {
|
||||
|
||||
var rowTemplate = wp.template( 'wc-tax-table-row' ),
|
||||
paginationTemplate = wp.template( 'wc-tax-table-pagination' ),
|
||||
$tbody = $('#rates');
|
||||
|
||||
/**
|
||||
|
@ -52,6 +53,11 @@
|
|||
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 )
|
||||
} ) );
|
||||
}
|
||||
|
||||
$('.wc_tax_rates .remove_tax_rates').click(function() {
|
||||
|
|
|
@ -166,3 +166,39 @@ wp_enqueue_script( 'wc-settings-tax' );
|
|||
</td>
|
||||
</tr>
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="tmpl-wc-tax-table-pagination">
|
||||
<div class="tablenav">
|
||||
<div class="tablenav-pages">
|
||||
<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">
|
||||
<span class="screen-reader-text"><?php esc_html_e( 'First page', 'woocommerce' ); ?></span>
|
||||
<span aria-hidden="true">«</span>
|
||||
</a>
|
||||
<a class="tablenav-pages-navspan">
|
||||
<span class="screen-reader-text"><?php esc_html_e( 'Previous page', 'woocommerce' ); ?></span>
|
||||
<span aria-hidden="true">‹</span>
|
||||
</a>
|
||||
|
||||
<span class="paging-input">
|
||||
<label for="current-page-selector" class="screen-reader-text"><?php esc_html_e( 'Current Page', 'woocommerce' ); ?></label>
|
||||
<?php printf( esc_html_x( '%1$s of %2$s', 'Pagination, like `1 of 3`', 'woocommerce' ),
|
||||
'<input class="current-page" id="current-page-selector" type="text" name="paged" value="{{ data.current_page }}" size="<# print( data.qty_pages.toString().length ) #>" aria-describedby="table-paging">',
|
||||
'<span class="total-pages">{{ data.qty_pages }}</span>' ); ?>
|
||||
</span>
|
||||
|
||||
<a class="tablenav-pages-navspan">
|
||||
<span class="screen-reader-text"><?php esc_html_e( 'Next page', 'woocommerce' ); ?></span>
|
||||
<span aria-hidden="true">›</span>
|
||||
</a>
|
||||
<a class="tablenav-pages-navspan">
|
||||
<span class="screen-reader-text"><?php esc_html_e( 'Last page', 'woocommerce' ); ?></span>
|
||||
<span aria-hidden="true">»</span>
|
||||
</a>
|
||||
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
Loading…
Reference in New Issue