:current:page not working in updated theme's datatable


I have used the updated theme's ktdatatable and I want to set the current page dynamic.

I have used :current-page="2" but not working and it's set 1st page by default event I have set 2 in current page parameter.

Waiting for your reply
Thank you!


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (5)


Hi,

Since now in our table component, we are using a custom pagination component, this property was temporarily removed, in the next Metronic v8.1.2 we will return it.

For now you can use element-plus pagiantion component as a temprary solution, you can change component in file kt-datatable/table-partials/TableFooter.vue.

Check element-plus pagination examples in the official doc:
https://element-plus.org/en-US/component/pagination.html



Thank you for your reply

Can you help me that how can I change this with a dynamic number in TableFooter.vue?



Here is an example, you can just paste it into your TableFooter.vue


<el-pagination :hide-on-single-page="true" :current-page="page" :page-size="itemsPerPage" :total="count" small background layout="prev, pager, next" class="mt-4"></el-pagination>


Also, you will need to update the page variable assign in TableFooter component.

page.value = 1; //set here a default pagination value or use data from props


As I say in previous question I have used ktdatatable with updated themes so there is no any el-pagination component.

Please check my TableFooter.vue file below





Hi,

el-pagination is an element-plus component, you don't need to import it, it should be available globally in all components.

Please check element-plus pagination component doc:
https://element-plus.org/en-US/component/pagination.html


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

React Dev Vacancy

KeenThemes is looking for a Junior React or Vue developer to build awesome apps.
Apply
keenthemes mega bundle