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

Sortable Column for Table #322

Closed
kodermax opened this Issue Feb 17, 2016 · 15 comments

Comments

Projects
None yet
7 participants
@kodermax
Contributor

kodermax commented Feb 17, 2016

Could you please add Sortable Column for Table.

@Kikobeats

This comment has been minimized.

Show comment
Hide comment
@Kikobeats

Kikobeats Feb 19, 2016

Contributor

Like that?

Contributor

Kikobeats commented Feb 19, 2016

Like that?

@javivelasco

This comment has been minimized.

Show comment
Hide comment
@javivelasco

javivelasco Feb 19, 2016

Member

What can be done for this is to provide a custom element for a Table heading and then add a callback function to sort data out of the table component. I'll try an example during the afternoon and leave this open meanwhile

Member

javivelasco commented Feb 19, 2016

What can be done for this is to provide a custom element for a Table heading and then add a callback function to sort data out of the table component. I'll try an example during the afternoon and leave this open meanwhile

@javivelasco javivelasco closed this Mar 6, 2016

@kodermax

This comment has been minimized.

Show comment
Hide comment
@kodermax

This comment has been minimized.

Show comment
Hide comment
@kodermax

kodermax Jun 5, 2016

Contributor

and pagination
image

Contributor

kodermax commented Jun 5, 2016

and pagination
image

@UniIsland

This comment has been minimized.

Show comment
Hide comment
@UniIsland

UniIsland Jul 14, 2016

Why is this issue closed?
Is sortable column still in the plan?

UniIsland commented Jul 14, 2016

Why is this issue closed?
Is sortable column still in the plan?

@kodermax

This comment has been minimized.

Show comment
Hide comment
@kodermax

kodermax Jul 14, 2016

Contributor

+1

Contributor

kodermax commented Jul 14, 2016

+1

@javivelasco

This comment has been minimized.

Show comment
Hide comment
@javivelasco

javivelasco Jul 16, 2016

Member

I think it can be achieved out of react toolbox. You can sort the source!

Member

javivelasco commented Jul 16, 2016

I think it can be achieved out of react toolbox. You can sort the source!

@UniIsland

This comment has been minimized.

Show comment
Hide comment
@UniIsland

UniIsland Jul 18, 2016

I think it can be achieved out of react toolbox. You can sort the source!

This is not interactive. One still need to implement the interface that tell the parent component (or backend, when paginated) to sort the source data.
If I want the table header to be clickable, I have to modify the code of react-toolbox's Table component directly.

UniIsland commented Jul 18, 2016

I think it can be achieved out of react toolbox. You can sort the source!

This is not interactive. One still need to implement the interface that tell the parent component (or backend, when paginated) to sort the source data.
If I want the table header to be clickable, I have to modify the code of react-toolbox's Table component directly.

@javivelasco

This comment has been minimized.

Show comment
Hide comment
@javivelasco

javivelasco Jul 18, 2016

Member

So the proper solution would be to modify the API so the Table accepts onClick handlers

Member

javivelasco commented Jul 18, 2016

So the proper solution would be to modify the API so the Table accepts onClick handlers

@vmsoftware

This comment has been minimized.

Show comment
Hide comment
@vmsoftware

vmsoftware Jul 18, 2016

Contributor

Currently, I'm working on a DATATABLE based on RT table lógic and follow the MD spec.

I'm making it in a responsive wrapper with horizontal scroll for content and I'll happy to share if @javivelasco agree...

This is a preview with header selected items, filters, pagination and rows per page..
I'm working on sortable column right now.

screenshot_20160717-214924

And filter like this:

screenshot_20160718-084451

Contributor

vmsoftware commented Jul 18, 2016

Currently, I'm working on a DATATABLE based on RT table lógic and follow the MD spec.

I'm making it in a responsive wrapper with horizontal scroll for content and I'll happy to share if @javivelasco agree...

This is a preview with header selected items, filters, pagination and rows per page..
I'm working on sortable column right now.

screenshot_20160717-214924

And filter like this:

screenshot_20160718-084451

@javivelasco

This comment has been minimized.

Show comment
Hide comment
@javivelasco

javivelasco Jul 18, 2016

Member

Nice! Did you change the code for the Table component we provide? Maybe we can include useful changes to make it more flexible so you can easily write this kind of wrappers and customize as you want

Member

javivelasco commented Jul 18, 2016

Nice! Did you change the code for the Table component we provide? Maybe we can include useful changes to make it more flexible so you can easily write this kind of wrappers and customize as you want

@vmsoftware

This comment has been minimized.

Show comment
Hide comment
@vmsoftware

vmsoftware Jul 20, 2016

Contributor

@javivelasco

yes I have modified 3 files but not directly. I copied the table directory from RT, created a DataTable.js for manage the state (filters, rows per page and other), add the header and footer and modified a little the Table.js and TableRow.js files to include a callback for tableHeadercolumnClick, assing the event for select rows and some small changes in your handleSelect function because the current versión don't work with the multiselectable and unselect features.

I'll try to finish during this week and upload it at the weekend. I think that RT Table can be merge some features that I did, like "headerColumnClick callback", "width of columns" in model prop and the possibility of select a row in any place of the row(not only at checkbox.

When I finish obviously I'm going to share with you for test and add all you think is good.

Contributor

vmsoftware commented Jul 20, 2016

@javivelasco

yes I have modified 3 files but not directly. I copied the table directory from RT, created a DataTable.js for manage the state (filters, rows per page and other), add the header and footer and modified a little the Table.js and TableRow.js files to include a callback for tableHeadercolumnClick, assing the event for select rows and some small changes in your handleSelect function because the current versión don't work with the multiselectable and unselect features.

I'll try to finish during this week and upload it at the weekend. I think that RT Table can be merge some features that I did, like "headerColumnClick callback", "width of columns" in model prop and the possibility of select a row in any place of the row(not only at checkbox.

When I finish obviously I'm going to share with you for test and add all you think is good.

@joshua1

This comment has been minimized.

Show comment
Hide comment
@joshua1

joshua1 Oct 3, 2016

@vmsoftware When are you doing a PR for this , or making it a component that can be added to a project.

joshua1 commented Oct 3, 2016

@vmsoftware When are you doing a PR for this , or making it a component that can be added to a project.

@devarsh

This comment has been minimized.

Show comment
Hide comment
@devarsh

devarsh Feb 2, 2017

@vmsoftware are you planning on sending a PR for this.

@javivelasco Why was this issue closed

devarsh commented Feb 2, 2017

@vmsoftware are you planning on sending a PR for this.

@javivelasco Why was this issue closed

@javivelasco

This comment has been minimized.

Show comment
Hide comment
@javivelasco

javivelasco Feb 2, 2017

Member

Because that's too much for a single component and it can be easily done with composition and the latest Table version.

Member

javivelasco commented Feb 2, 2017

Because that's too much for a single component and it can be easily done with composition and the latest Table version.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment