Posted 6 October 2021, 10:11 pm EST
Hi Wijmo team,
https://stackblitz.com/edit/angular-dbahg1?file=src/app/app.component.ts
Can we make pager no editable(if I change the no then it should change the page) in wijmo grid? and How?
Thanks
Forums Home / Wijmo / General Discussion
Posted by: sdayal on 6 October 2021, 10:11 pm EST
Posted 6 October 2021, 10:11 pm EST
Hi Wijmo team,
https://stackblitz.com/edit/angular-dbahg1?file=src/app/app.component.ts
Can we make pager no editable(if I change the no then it should change the page) in wijmo grid? and How?
Thanks
Posted 7 October 2021, 4:22 pm EST
Hello,
There isn’t any inbuilt feature for making a pager editable, however, you can customize it to take input for the current page index. Please refer to the sample link below demonstrating the same:
https://stackblitz.com/edit/angular-ozs5bd?file=src%2Fapp%2Fapp.component.ts
In the sample above, I have appended an input element to the pager to take the current page index and updated that index by handling input events into the collectionView. Also, make sure to update the index on pageChanged of the collectionView to show the current page index.
Let us know if that’s works for you.
Regards
Posted 18 October 2021, 10:17 pm EST
Hi,
As we bring the data dynamically this ‘initializedPager’ method does not provide us the pagecount or source collection value.
Can we use some other event in this ?
Thanks
Posted 19 October 2021, 10:10 pm EST
Hello,
I have created a function(createEditablePaging) to make the pager editable, you can use this function to create the editable paging navigator, you can use this function to dynamically make the pager editable. Please refer to the sample link below for reference:
https://stackblitz.com/edit/angular-dwx4dn?file=src%2Fapp%2Fapp.component.ts
In the above sample, I have called the function after the view gets created. Let us know if thats works for you.
Regards
Posted 25 October 2021, 10:40 pm EST
Hi Wijmo Team,
this.currentPageNo.addEventListener(‘input’, (e: any) => {
console.log(‘e.data’, e.data);
if (e.data != null) {
grid.collectionView.moveToPage(parseInt(e.data) - 1);
}
});
https://stackblitz.com/edit/angular-wswr6e?file=src%2Fapp%2Fapp.component.ts
If I enter 22 or 11 then e.data only take 2 or 1 instead of 22 or 11. Can you please help and
Thanks
Posted 26 October 2021, 6:02 pm EST
Hello,
https://stackblitz.com/edit/angular-xecajd?file=src%2Fapp%2Fapp.component.ts
In the sample link above, I have handle the keyup event instead of input and updated the pageIndex using entered value in the inputElement.
Regards
Posted 28 October 2021, 11:21 pm EST
Hi,
Thanks for response. The is one more thing how can we update the pager size count on filter.
Posted 1 November 2021, 9:01 pm EST
Hello,
To update the pager size count on the filter, we may handle the filterApplied event of FlexGrid Filter which occurs once the filter is applied, and may update the page count accordingly.
For more information on the above event, please refer to the below link:
https://www.grapecity.com/wijmo/api/classes/wijmo_grid_filter.flexgridfilter.html#filterapplied
Please refer to the updated sample below.
https://stackblitz.com/edit/angular-28xd4d?file=src%2Fapp%2Fapp.component.ts
Regards
Dushyant Sharma