LoadOnDemand tree and paging

asked 2023-11-08 17:07:50 +0800

ivtu gravatar image ivtu
11 2

updated 2023-11-08 23:27:30 +0800

Hello to all,

I want to ask how are you using tree and paging together? I do not like to see child tree items without parent. For example parent -> child -> grand relation and page size is 20 and parent is on 20th place. When I expand <parent> item, <child> item is not visible in current page. When I go to the next page, <child> item will be located on next page, but user cannot know where it belongs (what is parent of it).

Now I am thinking to implement some strange behavior using ZK 9.6.4: LoD tree with paging but to link paging only to the first level items and not for children. On this way if page size is for example 20, 20 parents will be visible and when I expand one parent, all sub-levels will be on that current page...

Is there a way to do something like this?

Regards, Ivan

delete flag offensive retag edit

1 Answer

Sort by ยป oldest newest most voted

answered 2023-11-13 14:42:14 +0800

MDuchemin gravatar image MDuchemin
2480 1 6
ZK Team

Hi Ivan

I think doing what you are explaining is possible. It will require some extra handling, but it should work.

First thing is, you cannot use the default Tree in paging mold. Tree in paging mold will always render "one page worth" of items, regardless of their depth in the tree.

Instead, you will need to use a standalone paging component: https://www.zkoss.org/wiki/ZKComponentReference/Supplementary/Paging

You can put that paging component anywhere in the page, but I assume you'll want to put it on top of, or below the tree. You can then listen to events from the paging component (onPaging event is triggered when the user navigate in the paging), and update your tree structure accordingly.

In regard to the tree structure, it depends on where you data is located. If you want to do something like "always display 20 level-1 children and all of the grandchildren", then you might as well create separate tree models for each ranges (1 to 20, 21-40, 41-60, ... ) and replace the model of the tree component whenever onPaging is triggered on the paging component.

If you are loading the data dynamically from a persistence layer, then the options get more complicated :D but it boils down to building the tree models whenever paging happens.

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

1 follower



Asked: 2023-11-08 17:07:50 +0800

Seen: 7 times

Last updated: Nov 13

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More