Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make paginationPage an optional, controllable property #1037

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

bembleton
Copy link

  • add paginationPage property to DataTable
  • call handleChangePage when paginationPage changes
  • maintain existing pagination controls and actions

I was looking for a way to reset the table back to the first page, and I was not happy with the way that paginationResetDefaultPage works. I prefer using a value/onValueChanged pattern so I would like to add a paginationPage property to control which page is selected when using either client-side or server-side pagination. It's expected that paginationPage and onChangePage are used together and kept in sync so that the pagination controls and actions still work:

const [page, setPage] = useState(1);

<DataTable
	data={data}
	columns={columns}
	pagination
	paginationPage={page}
	onChangePage={setPage}
/>

- add paginationPage property to DataTable
- call handleChangePage when paginationPage changes
@netlify
Copy link

netlify bot commented Apr 14, 2022

Deploy Preview for react-data-table-component ready!

Name Link
🔨 Latest commit caf564b
🔍 Latest deploy log https://app.netlify.com/sites/react-data-table-component/deploys/625d845ece99ee0008c59aef
😎 Deploy Preview https://deploy-preview-1037--react-data-table-component.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@jbetancur jbetancur self-assigned this May 5, 2022
@GabrielLourenco
Copy link

Any release date?

@MarcoDeJong
Copy link

Looking great!

@garrylachman
Copy link

ERA for merge?

@sadashivm
Copy link

Hello @jbetancur and team,
I'm unable to create new issue here hence I'm adding my doubts here only. please don't mind.
First of all, I want to say thank you so much for this react-data-table-component npm package. It has lot of features that you have added. It's really awesome.

My request is how to display header text as well as row data completely. Currently If header text / row cells data is greater than 30 to 40 character then you are showing ellipse (...). I know there is one column property like,
grow : 5

If I add above property in header column, then it's increasing the width of column. But is there any other way to display complete header text and row content without adding this property?.

@mybess00
Copy link

mybess00 commented Jan 9, 2025

Any update about this? There is any way to reset table back to the first page manually?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

8 participants