DataTable: Saving filtering and ordering

UI Components for Angular
Post Reply
CC84
Posts: 69
Joined: 11 Mar 2016, 09:32

23 Mar 2016, 15:46

I have to come back to my wish to reset a DataTable to Page 1.

Meanwhile (i startet using lots of filtering and ordering) i'd like to extend my featurerequest. It would be great to be able to Save/Edit/Load the whole DataTable state. Then i could reset table state, after user surfed to another side an came back again.
Would it be possible to provide a Dualway Bindable Property containing all these infos?

cagatay.civici
Prime
Posts: 18616
Joined: 05 Jan 2009, 00:21
Location: Cybertron
Contact:

23 Mar 2016, 17:03

Would it be a bad practice to call reset directly on datatable?

Code: Select all

<p-datatable #dt ...
<button (click)="reset(dt)" label="Reset" pButton></button>

Code: Select all

reset(dt: DataTable) {
   dt.reset()
}

CC84
Posts: 69
Joined: 11 Mar 2016, 09:32

23 Mar 2016, 23:39

Nice idea. All the time i was puzzeling how to access a component directly and not via event/Binding.

Conceptual is mixing view and logic not the best practice.

Does your sample need this mixing?

What about:

Code: Select all

<p-datatable #dt ...
<button (click)="dt.reset()" label="Reset" pButton></button>
Apart from this, i'd like to have something like:

Code: Select all

<p-datatable #dt ...
<button (click)="MyStoredSettings = dt.save()" label="Save Current DT-Settings" pButton></button>
<button (click)="dt.restore(MyStoredSettings)" label="Restore DT-Settings" pButton></button>
I think, the LazyLoadEvent contains all the necessary infos. Maybe it's sufficient to build something like this:

Code: Select all

In component.ts:

public myDtSettings:LazyLoadEvent;

OnLazyLoad(event:LazyLoadEvent){
  this.myDtSettings = event;
  localStorage.setItem('myDtSettings', event);
  ..DOING
}

onNgInit(){
  myDtSettings = localStorage.getItem('myDtSettings');
}
reset(){
  myDtSettings = null;
}
goToPage1(){
  myDtSettings.first = 1;
}

In Template:
<p-datatable [settings]="myDtSettings" (onLazyLoad)="OnLazyLoad($event)"></p-datatable>

cagatay.civici
Prime
Posts: 18616
Joined: 05 Jan 2009, 00:21
Location: Cybertron
Contact:

24 Mar 2016, 13:48

Mixin is not suggested but it really makes sense here to use reset().

For restore, I guess instead of methods, you should be able to bind filters, sorting, paging to attributes of datatable. We just need to add setters to datatable to listen changes on page, sort, filters and take actions. We'll definitely to it for 1.0.

I've expanded the context of the issue;

https://github.com/primefaces/primeng/issues/114

For example to reset sorting, set field = null;

Code: Select all

<p-datatable sortField="field"

Code: Select all

clickBtn() {
  sortField = null;
}
Similar for paging and filtering. I'd prefer it over reset as well although reset is much easier(). We'll add reset as a shortcut. Hope the idea is clear.

Post Reply

Return to “PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 5 guests