daniel-nagy / md-data-table

Material Design Data Table for Angular Material
MIT License
1.9k stars 520 forks source link

Not sort all page, just only one page #565

Closed zzjustinzz closed 7 years ago

zzjustinzz commented 7 years ago

Dont know why my table is order in only one page, not all page.

image

Anyone can help me :(

My code:

ielektronick commented 7 years ago

For md-head there's an attribute: md-on-reorder="getItems". Did you try it? Also delete orderBy from ng-repeat. And isn't it better to use: <md-table-pagination md-limit="query.limit" md-limit-options="[5, 10, 15, 25]" md-page="query.page" md-total="{{items.count}}" md-on-paginate="getItems" md-page-select></md-table-pagination> And delete limitTo from ng-repeat?

zzjustinzz commented 7 years ago

image

I have tried follow your instruction, but it's not still working. :(

zzjustinzz commented 7 years ago

[image: Inline image 1]

I have tried follow your instruction, but it's not still working. :( ᐧ

On Wed, Mar 22, 2017 at 6:52 PM, Arthur notifications@github.com wrote:

Just to provide a working example. Mark-up: [image: 2017-03-22 13_48_10-cphdev7 - remote desktop connection] https://cloud.githubusercontent.com/assets/889454/24196405/5f2c5d32-0f06-11e7-88ba-305f8db638cf.png Code: self.$scope.manufacturers = []; self.$scope.query = { filter: '', limit: 15, order: 'name', page: 1 }; self.$scope.getManufacturers = function () { self.$scope.promise = self.manufacturerService .get(self.$scope.query, function (response) { self.$scope.manufacturers = response.items; self.$scope.manufacturers.count = response.itemsCount; }); };

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/daniel-nagy/md-data-table/issues/565#issuecomment-288376047, or mute the thread https://github.com/notifications/unsubscribe-auth/AEwK9dZNgWqg5nUmPvDHiBI5f_l2AIf3ks5roQuBgaJpZM4Mk8Pi .

ielektronick commented 7 years ago

Okay, as far as I can see, you load items from the API. At least I see md-progress usage, which should be used only for that. :) Let me share a working example. So here's a mark-up: 2017-03-23 11_04_49-cphdev7 - remote desktop connection Here's an initial state inside controller: 2017-03-23 11_05_19-cphdev7 - remote desktop connection Here's a code for getManufacturers method: 2017-03-23 11_06_18-cphdev7 - remote desktop connection Now, all together. Page 1: 2017-03-23 11_10_21-cphdev7 - remote desktop connection Page 2: 2017-03-23 11_10_41-cphdev7 - remote desktop connection

In case you're using pagination on a front-end, then it should be done a bit in another way. :)

muscaiu commented 7 years ago

Is your Search filter working for the current page only or for the whole data?

zzjustinzz commented 7 years ago

My Search filter is working for the whole data, but order is just only current page.

ielektronick commented 7 years ago

For the whole data.

zzjustinzz commented 7 years ago

Dont know why, but it's not work for me:

My HTML: image

My controller: image image

My page:

-Page 2 image

ielektronick commented 7 years ago

I see. So you load all the items and try to sort them and paginate? :)

zzjustinzz commented 7 years ago

Yep. I load all item first and sort, paging them then.

ielektronick commented 7 years ago

Okay, I assume that data is not ordered from the beginning thus you have such strange pagination with ordering. Try to order the data right after you received it: $scope.kaizens = kaizens.result.map(function(k1, k2) { if (k1.name > k2.name) { return 1; } if (k1.name < k2.name) { return -1; } return 0; };

Or by any other property (e.g. kaizenNumber). In case of kaizenNumber ordering: $scope.kaizens = kaizens.result.map(function(k1, k2) { return k1.kaizenNumber - k2.kaizenNumber; };

Or even better: try to put orderBy filter before limitTo. So in your case: 2017-03-23 12_17_18-cphdev7 - remote desktop connection

ielektronick commented 7 years ago

So, as a summary. Return to original mark-up and code and put orderBy before limitTo. And delete md-progress attribute.

zzjustinzz commented 7 years ago

Thanks its worked.