Navigation Panel
Under construction
Contents
- 1 See Also
- 2 Overview
- 3 Show navigation panel
- 4 Collapsable
- 5 Collapse when first loaded
- 6 Position on page
- 7 Show caption
- 8 Caption height
- 9 Caption
- 10 Width
- 11 Custom UI page
- 12 Show child indicators
- 13 Alternating row colors
- 14 Double click to select
- 15 Column headers
- 16 Data source
- 17 Selection column
- 18 Item sync expression
- 19 Selection delegate
- 20 Show ActionBar
- 21 Add delegate
- 22 Delete delegate
- 23 Row height
- 24 Font size
- 25 CSS style
See Also
App Settings, Colors, CSS, Left Sidebar, Page Attributes, Right Sidebar, Stackable Accordion Sections, Understanding Lianja UI Navigation, Using the showdocument() function and Lianja.showDocument() method
Overview
Show a Navigation panel on the left side of the page (True | False). By default this is a TreeGrid, so you can load it in the load delegate for the page and structure it as a Grid or a Tree.
Collapsable
Enable collapsing and expanding for the Navigation panel (True | False).
Collapse when first loaded
Hide Navigation panel when first loaded. Use $("page:yourpagename?action=shownavigationpanel") to show it and $("page:yourpagename?action=hidenavigationpanel") to hide it again.
Position on page
Navigation panel position on page (Left | Right).
Show caption
Show Navigation panel caption (True | False).
Caption height
Navigation panel caption height.
Caption
Navigation panel caption.
Width
Navigation panel width.
Custom UI page
Specify an (optional) custom UI Page from the UI Page Library to embed into the Navigation panel.
Show child indicators
Show child indicators.
Alternating row colors
Alternating row colors.
Double click to select
Check this if you want the selection delegate to be called on a double-click rather than a single click.
Column headers
Specify a comma separated list of column headers.
Data source
Specify a comma separated list of items to load as caption#icon, a SQL SELECT statement to load from a data source or specify a .rsp, .jssp or html page. Note that you can optionally load the Navigation panel in the load delegate for the page.
Selection column
When using a multi column TreeGrid, specify the column you want to select when calling the selection delegate.
Item sync expression
Specify an expression to evaluate to keep the TreeGrid in sync while data is navigated in the page.
Selection delegate
Specify a delegate to call when a row is clicked. Note that you can use an 'inline' delegate like this: $("section:yoursectionid?action=search&text={}") Notice how {} is used to substitute the value of the item selected.
Show ActionBar
Show the actionbar at the bottom of the Navigation panel (True | False).
Add delegate
Specify a delegate to call when the 'Add' icon is clicked. Note that you can use an 'inline' delegate like this: $("section:yoursectionid?action=add").
Delete delegate
Specify a delegate to call when the 'Delete' icon is clicked. Note that you can use an 'inline' delegate like this: $("section:yoursectionid?action=delete").
Row height
Row height for the Tree items in the Navigation panel.
Font size
Font size for the Tree items in the Navigation panel.
- See Fonts.
CSS style
CSS style for the Navigation panel and its Tree (separate attributes with ; or use app:/filename.css).
- See CSS.