@@ -250,15 +250,17 @@ export class IgxGridNavigationService {
250
250
}
251
251
252
252
public navigateTop ( visibleColumnIndex ) {
253
+ const targetIndex = this . findFirstDataRowIndex ( ) ;
253
254
const verticalScroll = this . grid . verticalScrollContainer . getScroll ( ) ;
254
255
const cellSelector = this . getCellSelector ( visibleColumnIndex ) ;
255
- if ( verticalScroll . scrollTop === 0 ) {
256
+ const targetScr = this . grid . verticalScrollContainer . getScrollForIndex ( targetIndex , false ) ;
257
+ if ( targetScr >= verticalScroll . scrollTop ) {
256
258
const cells = this . grid . nativeElement . querySelectorAll (
257
259
`${ cellSelector } [data-visibleIndex="${ visibleColumnIndex } "]` ) ;
258
260
( cells [ 0 ] as HTMLElement ) . focus ( ) ;
259
261
} else {
260
262
this . getFocusableGrid ( ) . nativeElement . focus ( { preventScroll : true } ) ;
261
- this . grid . verticalScrollContainer . scrollTo ( 0 ) ;
263
+ this . grid . verticalScrollContainer . scrollTo ( targetIndex !== - 1 ? targetIndex : 0 ) ;
262
264
this . grid . verticalScrollContainer . onChunkLoad
263
265
. pipe ( first ( ) ) . subscribe ( ( ) => {
264
266
const cells = this . grid . nativeElement . querySelectorAll (
@@ -268,17 +270,34 @@ export class IgxGridNavigationService {
268
270
}
269
271
}
270
272
273
+ private findFirstDataRowIndex ( ) {
274
+ const dv = this . grid . dataView ;
275
+ return dv . findIndex ( rec => ! this . grid . isGroupByRecord ( rec ) && ! this . grid . isDetailRecord ( rec ) ) ;
276
+ }
277
+
278
+ private findLastDataRowIndex ( ) {
279
+ let i = this . grid . dataView . length ;
280
+ while ( i -- ) {
281
+ const rec = this . grid . dataView [ i ] ;
282
+ if ( ! this . grid . isGroupByRecord ( rec ) && ! this . grid . isDetailRecord ( rec ) ) {
283
+ return i ;
284
+ }
285
+ }
286
+ }
287
+
271
288
public navigateBottom ( visibleColumnIndex ) {
289
+ const targetIndex = this . findLastDataRowIndex ( ) ;
290
+ const targetScr = this . grid . verticalScrollContainer . getScrollForIndex ( targetIndex , true ) ;
272
291
const verticalScroll = this . grid . verticalScrollContainer . getScroll ( ) ;
273
292
const cellSelector = this . getCellSelector ( visibleColumnIndex ) ;
274
293
if ( verticalScroll . scrollHeight === 0 ||
275
- verticalScroll . scrollTop === verticalScroll . scrollHeight - this . grid . verticalScrollContainer . igxForContainerSize ) {
294
+ verticalScroll . scrollTop === targetScr ) {
276
295
const cells = this . grid . nativeElement . querySelectorAll (
277
296
`${ cellSelector } [data-visibleIndex="${ visibleColumnIndex } "]` ) ;
278
297
( cells [ cells . length - 1 ] as HTMLElement ) . focus ( ) ;
279
298
} else {
280
299
this . getFocusableGrid ( ) . nativeElement . focus ( { preventScroll : true } ) ;
281
- this . grid . verticalScrollContainer . scrollTo ( this . grid . dataView . length - 1 ) ;
300
+ this . grid . verticalScrollContainer . scrollTo ( targetIndex !== - 1 ? targetIndex : this . grid . dataView . length - 1 ) ;
282
301
this . grid . verticalScrollContainer . onChunkLoad
283
302
. pipe ( first ( ) ) . subscribe ( ( ) => {
284
303
const cells = this . grid . nativeElement . querySelectorAll (
@@ -366,12 +385,14 @@ export class IgxGridNavigationService {
366
385
}
367
386
368
387
public goToFirstCell ( ) {
388
+ const targetIndex = this . findFirstDataRowIndex ( ) ;
389
+ const targetScr = this . grid . verticalScrollContainer . getScrollForIndex ( targetIndex , false ) ;
369
390
const verticalScroll = this . grid . verticalScrollContainer . getScroll ( ) ;
370
- if ( verticalScroll . scrollTop === 0 ) {
391
+ if ( verticalScroll . scrollTop === targetScr ) {
371
392
this . onKeydownHome ( this . grid . dataRowList . first . index ) ;
372
393
} else {
373
394
this . getFocusableGrid ( ) . nativeElement . focus ( { preventScroll : true } ) ;
374
- this . grid . verticalScrollContainer . scrollTo ( 0 ) ;
395
+ this . grid . verticalScrollContainer . scrollTo ( targetIndex !== - 1 ? targetIndex : 0 ) ;
375
396
this . grid . verticalScrollContainer . onChunkLoad
376
397
. pipe ( first ( ) ) . subscribe ( ( ) => {
377
398
this . onKeydownHome ( this . grid . dataRowList . first . index ) ;
@@ -380,15 +401,17 @@ export class IgxGridNavigationService {
380
401
}
381
402
382
403
public goToLastCell ( ) {
404
+ const targetIndex = this . findLastDataRowIndex ( ) ;
405
+ const targetScr = this . grid . verticalScrollContainer . getScrollForIndex ( targetIndex , true ) ;
383
406
const verticalScroll = this . grid . verticalScrollContainer . getScroll ( ) ;
384
407
if ( verticalScroll . scrollHeight === 0 ||
385
- verticalScroll . scrollTop === verticalScroll . scrollHeight - this . grid . verticalScrollContainer . igxForContainerSize ) {
408
+ verticalScroll . scrollTop === targetScr ) {
386
409
const rows = this . getAllRows ( ) ;
387
410
const rowIndex = parseInt ( rows [ rows . length - 1 ] . getAttribute ( 'data-rowIndex' ) , 10 ) ;
388
411
this . onKeydownEnd ( rowIndex ) ;
389
412
} else {
390
413
this . getFocusableGrid ( ) . nativeElement . focus ( { preventScroll : true } ) ;
391
- this . grid . verticalScrollContainer . scrollTo ( this . grid . dataView . length - 1 ) ;
414
+ this . grid . verticalScrollContainer . scrollTo ( targetIndex !== - 1 ? targetIndex : this . grid . dataView . length - 1 ) ;
392
415
this . grid . verticalScrollContainer . onChunkLoad
393
416
. pipe ( first ( ) ) . subscribe ( ( ) => {
394
417
const rows = this . getAllRows ( ) ;
0 commit comments