sync of top and bottom pagination

[Jack Bakker, geändert vor 8 Jahren.]

In portlet, I have a pagination at top of records and also at bottom and am trying to sync the two where 'on' select of top will setState of bottom and vice versa.

How do I reference the 'other' pagination object ? (below referenced as ***pagination2obj*** and ***paginationObj***)

YUI()
                .use(
                                'aui-pagination',
                                function(Y) {
                                        var pages = Y.all('.content > div');
                                        new Y.Pagination(
                                                        {
                                                                boundingBox : '#pagination',
                                                                circular : false,
                                                                contentBox : '#pagination .pagination-content',
                                                                on : {
                                                                        changeRequest : function(event) {
                                                                                var instance = this, state = event.state, lastState = event.lastState;
                                                                                ***pagination2ojb***.setState(state)
...

YUI()
                .use(
                                'aui-pagination',
                                function(Y) {
                                        var pages = Y.all('.content > div');
                                        new Y.Pagination(
                                                        {
                                                                boundingBox : '#pagination2',
                                                                circular : false,
                                                                contentBox : '#pagination2 .pagination-content',
                                                                on : {
                                                                        changeRequest : function(event) {
                                                                                var instance = this, state = event.state, lastState = event.lastState;
                                                                                ***paginationOjb***.setState(state)
...

[David H Nebinger, geändert vor 8 Jahren.]

Could you use a class selector in conjuction with Y.all('pagination-state').setState(state); sort of thing?

That way you're not updating a specific element, but you'd be updating all elements that have the particular class...

[Jack Bakker, geändert vor 8 Jahren.]

I've tried Y.one('#pagination').setState and David's Y.all('pagination').setState (and I tried other classes) but get:

Uncaught TypeError: g.setState is not a function

clearly I am not scoping to the object properly... below is the browser element source

<div id="pagination" class="yui3-widget component pagination pagination-focused"> <ul class="pagination pagination-content" id="yui_patched_v3_11_0_5_1438183041846_11"><li class="pagination-control disabled" id="yui_patched_v3_11_0_3_1438183041846_53"><a href="#" id="yui_patched_v3_11_0_3_1438183041846_52">Prev</a></li><li class="active"><a href="#">1</a></li><li class=""><a href="#">2</a></li><li class=""><a href="#">3</a></li><li class=""><a href="#">4</a></li><li class="pagination-control"><a href="#">Next</a></li></ul> </div>