Our blazing fast Grid component built with pure JavaScript


Post by gregc »

So I guess this due to the next page button putting us to the top of the page which is great.

However I have been using grid.store.loadPage to just refresh all the rows whenever an action comes in that can affect one or more rows. Now they lose their place in the grid and it goes to the top.

Is there an alternative where I can load all the rows on the page without losing my spot?

Last edited by gregc on Thu Jun 10, 2021 5:22 pm, edited 1 time in total.

Post by mats »

Tired of debugging javascript errors in web applications? Try our powerful error logging service RootCause


Post by gregc »

That does fix the issue. But it does bring back the issue of going to the next page does not scroll you to the top of the page.

If a user presses the next page button, is there anything I can slap a listener on so I can trigger some code when a page is reloaded using that button (but not when I call loadPage via code).


Post by mats »

Maybe just reset scroll when you feel it's suitable?

grid.scrollable.y = 0

Tired of debugging javascript errors in web applications? Try our powerful error logging service RootCause


Post by gregc »

Sure but how do I do that if and only if the next page button is pressed? Can I add a listener to that button?

Image


Post by mats »

Sure:

yourToolbar.widgetMap.nextPageButton.on('click', console.log)

and so forth. Here are the widgets available:

items : {

            firstPageButton : {
                onClick : 'up.onFirstPageClick',
                icon    : 'b-icon-first'
            },
            previousPageButton : {
                onClick : 'up.onPreviousPageClick',
                icon    : 'b-icon-previous'
            },
            pageNumber : {
                type                    : 'numberfield',
                label                   : 'L{page}',
                min                     : 1,
                max                     : 1,
                triggers                : null,
                onChange                : 'up.onPageNumberChange',
                highlightExternalChange : false
            },
            pageCount : {
                type : 'widget',
                cls  : 'b-pagecount b-toolbar-text'
            },
            nextPageButton : {
                onClick : 'up.onNextPageClick',
                icon    : 'b-icon-next'
            },
            lastPageButton : {
                onClick : 'up.onLastPageClick',
                icon    : 'b-icon-last'
            },
            separator : {
                type : 'widget',
                cls  : 'b-toolbar-separator'
            },
            reloadButton : {
                onClick : 'up.onReloadClick',
                icon    : 'b-icon-reload'
            },
            spacer : {
                type : 'widget',
                cls  : 'b-toolbar-fill'
            },
            dataSummary : {
                type : 'widget',
                cls  : 'b-toolbar-text'
            }
        }

Tired of debugging javascript errors in web applications? Try our powerful error logging service RootCause


Post by gregc »

that works, thanks thats a relief !


Post Reply