Thread ID: |
Created: |
Updated: |
Platform: |
Replies: |
| 144950 | May 29,2019 07:16 PM UTC | Jun 12,2019 04:47 AM UTC | Angular - EJ 2 | 5 |
|
Tags: Grid |
|
@Component({
selector: 'app-root',
template: ' <ejs-grid #grid [dataSource]='data' (created)="created($event)" allowPaging='true' height=365 [pageSettings]='initialPage'>
<e-columns>
. . .
</e-columns>
</ejs-grid>'
})
export class AppComponent {
created(e){
(this.grid.pagerModule as any).element.addEventListener("keydown",(e)=>{
if( e.which == 9 && e.target.classList.contains('e-numericitem') ) {
let total =this.grid.pagerModule.pagerObj.totalPages;
let next = this.grid.pageSettings.currentPage+1;
if(next <= total){
e.preventDefault();
this.grid.pageSettings.currentPage = next;
}
}
})
}
} |
|
App.component.ts
. . .
created(e){
(this.grid.pagerModule && this.grid.pagerModule as any).element.addEventListener("keydown",(e)=>{ //checking that pagerModule is available or not
if( e.which == 9 && e.target.classList.contains('e-numericitem') ) {
let total =this.grid.pagerModule.pagerObj.totalPages;
let next = this.grid.pageSettings.currentPage+1;
if(next <= total){
e.preventDefault();
this.grid.pageSettings.currentPage = next;
}
}
})
}
actionComplete (args) {
if (args.requestType == 'paging') { // you can add the condition here based on your requirement
this.grid.selectRow(0); //selecting the row to focus the Grid
}
}
}
App.component.html
<ejs-grid #grid [dataSource]='data' (created)="created($event)" (actionComplete)="actionComplete($event)" allowPaging='true' height=365 [pageSettings]='initialPage'>
<e-columns>
. . .
</e-columns>
</ejs-grid> |
This post will be permanently deleted. Are you sure you want to continue?
Sorry, An error occured while processing your request. Please try again later.
This page will automatically be redirected to the sign-in page in 10 seconds.
You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.
