Page Attributes

From Lianjapedia
Jump to: navigation, search

Overview

Setting Attributes Declaratively

You adjust the appearance and behavior of each UI Element in the Attributes Tab of the App Inspector.

Bm-attributes.png

The attributes available consist of some common ones as well as some specific to the UI Element being inspected.

Getting and Setting Attributes Programatically

The setAttribute(name, value) method can be used to set the value of an Attribute:

Lianja.get("pageid").setAttribute("title","Page1")

Note: on the desktop, the shortened form setAttr(name,value) is also available.

The getAttribute(name) method can be used to get the value of an Attribute:

cTitle = Lianja.get("pageid").getAttribute("title")

Note: on the desktop, the shortened form getAttr(name) is also available.

Attributes

Details

Attribute Description Name Type
Name The unique name for this page. id Character
Alias name The alias name for this page. aliasid Character
App Doc The App Doc file for this page. This will be included in the App Doc when it is generated. appdoc Character
Meta types A comma separated list of metatype names. metatypes Character
Title The menu title for this page. title Character
Menu icon image The menu icon image for the title (png | jpg | gif).
Use app:/imagename.ext for app specific images.
Note that in the mobile client this icon will be displayed in the PageBar.
menuIcon Character
Autosave in Page Library Always save this page to the UI Page Library when an App is saved. alwaysSaveInPageLibrary Boolean
Query Page When this is checked, no data is shown until a search or filter has been performed. queryPage Boolean
Mobile login Page When this is checked, this page will be used as the Mobile login page. loginPage Boolean
Deferred load When this is checked, this page will be loaded with data only when it is first activated (speeds up App load time). deferredLoad Boolean
Refresh when activated Refresh all sections on this page when the page is activated. refreshWhenActivated Boolean
Full page edit Edit all editable sections on this page when the page is edited. fullPageEdit Boolean

Appearance

Attribute Description Name Type
Current page height Current page height (displayed in Attributes only).
Background color Page background color. backColor Character
Foreground color Page foreground color. foreColor Character
CSS style CSS style (separate attributes with ; or use app:/filename.css). cssStyle Character
Gradient colors Render the background color as a gradient (True | False). pageGradient Boolean
Gradient type Specify the gradient type. pageGradientType Int
Gradient start color Gradient start color. pageFromColor Character
Gradient end color Gradient end color. pageToColor Character
Transparency Specify a transparency percentage from 0 to 100. transparency Int
Background image The background image for the page (png | jpg | gif).
Use app:/imagename.ext for app specific images.
picture Character
Stretch image Stretch the background image to fill the page (True | False). stretch Boolean
Margin Margin size around the page. marginSize Int
Hide page from menu Hide page from menu at runtime. hideFromMenuAtRuntime Boolean
Accordion behavior Render as accordion sections (True | False). accordionAtRuntime Boolean
Use Accordions Render as accordion sections on low resolution displays. useAccordionOnLowres Boolean
Use Accordions height Render as accordion sections on low resolution displays less than this height. useAccordionOnLowresValue Int
Stacked behavior at runtime Treat accordion sections as stacked at runtime allowing the sections to be made raised from the Navigation Panel. accordionStackAtRuntime Boolean
Stretch last section Stretch last section to bottom of page. stretchLastSectionAtRuntime Boolean
Auto layout sections Auto layout sections by section percentage. autoLayoutSections Boolean
Last section min height If the last section is less than this height, then set it to this height and show page vertical scrollbar. stretchLastSectionMinHeight Int
Last section fixed height The last section is set to this fixed height and the previous section expanded to fill the space. stretchLastSectionMaxHeight Int
Hide actionbar Hide the actionbar. hideActionBarAtRuntime Boolean
Hide navigation bar slider Hide the navigation bar slider. hideSlider Boolean
Sync actionbar buttons Keep the actionbar buttons in sync with the current data position. Turn this off to improve performance with large amounts of data. syncActionBar Boolean
Show options icon Show the options menu icon in the actionbar. showOptionsButton Boolean
Custom options menu Custom options menu (comma separated list of values). customOptionsMenu Character
Show scrollbar Show a vertical scrollbar for the page. scrollbarVisibleAtRuntime Boolean
Show scrollbar height Show vertical scrollbar on low resolution displays less than this height. useScrollbarMinHeight Boolean
Navigation bar background color Navigation bar background color. navbarBackColor Character

Header

Attribute Description Name Type
Visible Header visible (True | False). headerVisible Boolean
Custom header Render the page header using the 'Custom header display delegate' (True | False). customheader Boolean
Custom header display delegate The name of a procedure/function that will render the page header. customheaderdisplay Character
Caption Header caption. headerCaption Character
Height Header height. headerheight Int
Background color Header background color. headerBackColor Character
Foreground color Header foreground color. headerForeColor Character
Header bottom border Display Header bottom border (True | False). headerBottomBorder Boolean
Header bottom border color Header bottom border color. headerBorderBottomColor Character
Header image The image for the Header (png | jpg | gif).
Use app:/imagename.ext for app specific images.
headerImage Character
Gradient colors Render the Header background color as a gradient (True | False). headerGradient Boolean
Gradient type Specify the gradient type. headerGradientType Int
Gradient start color Gradient start color. headerFromColor Character
Gradient end color Gradient end color. headerToColor Character
Hide header icon Hide the header icon in the page Header (True | False). hideHeaderIcon Boolean
Hide search box Hide the search box in the page Header (True | False). hideSearchBox Boolean
Minimum search text length Minimum number of characters to type in the search box before search is made. searchBoxMinChars Int
Hide notifications icon Hide the notifications icon in the page Header (True | False). hideNotificationIcon Boolean
Hide custom search icon Hide the custom search icon in the page Header (True | False). hideCustomSearchIcon Boolean
Hide fullscreen icon Hide the fullscreen icon in the page Header (True | False). hideFullScreenIcon Boolean
Hide share icon Hide the share icon in the page Header (True | False). hideShareIcon Boolean
Hide home icon Hide the home icon in the page Header (True | False). hidehomeicon Boolean
Hide print icon Hide the print icon in the page Header (True | False). hideprinticon Boolean
Hide hamburger menu Hide the hamburger menu icon at runtime (True | False). hidehamburgermenuicon Boolean
Hide navigation history icons Hide the navigation history buttons in the page header (True | False). hidenavigationhistorybuttons Boolean

Footer

Attribute Description Name Type
Visible Footer visible (True | False). footerVisible Boolean
Custom footer display delegate The name of a procedure/function that will render the page footer. customfooterdisplay Character
Height Footer height. footerHeight Int
Background color Footer background color. footerBackColor Character
Foreground color Footer foreground color. footerForeColor Character
Footer image The image for the Footer (png | jpg | gif).
Use app:/imagename.ext for app specific images.
footerImage Character
Gradient colors Render the Footer background color as a gradient (True | False). footerGradient Character
Gradient type Specify the gradient type. footerGradientType Int
Gradient start color Gradient start color. footerFromColor Character
Gradient end color Gradient end color. footerToColor Character
Refresh interval The interval in seconds that the Footer content will be refreshed. footerCustomGadgetRefreshInterval Int

Left Sidebar

Attribute Description Name Type
Show left sidebar Show left sidebar (True | False). leftSidebarVisible Boolean
Collapse left sidebar Collapse left sidebar when the App is first loaded (True | False). collapseLeftSidebar Boolean
Width Left sidebar width. leftSidebarWidth Int
Show left sidebar logo image Show left sidebar logo image (True | False). leftSidebarImageVisible Boolean
Logo image The logo displayed at the top of the left sidebar (png | jpg | gif).
Use app:/imagename.ext for app specific images.
leftSidebarImage Character
Show login panel Show the login panel in the left sidebar (True | False). leftSidebarLoginPanelVisible Boolean
Show Apps Show the Apps menu in the left sidebar (True | False). leftSidebarAppsVisible Boolean
Show Apps Caption Show the Apps caption above the Apps menu (True | False). leftSidebarAppsHeaderVisible Boolean
Show Menu Show the page menu in the left sidebar (True | False). leftSidebarMenuVisible Boolean
Show Recent Items Show Watches, Favorites, Recently Viewed/Modified items and Instant Selections in the left sidebar (True | False). leftSidebarItemsVisible Boolean
Background color Left sidebar background color. leftSidebarBackColor Character
Foreground color Left sidebar foreground color. leftSidebarForeColor Character
Border color Left sidebar border color. leftSidebarBorderColor Character
Favorite items The number of Favorites to display. leftSidebarFavoriteItems Int
Recently viewed items The number of Recently Viewed items to display. leftSidebarRecentlyViewedItems Int
Recently modified items The number of Recently Modified items to display. leftSidebarRecentlyModifiedItems Int
Watched items The number of Watched items to display. leftSidebarWatchedItems Int
Refresh interval The interval in seconds that the Instant Selections content will be refreshed. leftSidebarRefreshInterval Int

Navigation panel

Attribute Description Name Type
Show navigation panel 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.
leftSidebarTreeVisible Boolean
Collapsable Enable collapsing and expanding for the Navigation panel (True | False). navigationPanelCollapsable Boolean
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.
navigationPanelCollapseOnload Boolean
Position on page Navigation panel position on page(Left | Right). navigationPanelPosition Character
Show caption Show Navigation panel caption (True | False). leftSidebarTreeCaptionVisible Boolean
Caption height Navigation panel caption height. leftSidebarTreeCaptionHeight Int
Caption Navigation panel caption. leftSidebarTreeCaption Character
Width Navigation panel width. leftSidebarTreeWidth Int
Custom UI page Specify an (optional) custom UI Page from the UI Page Library to embed into the Navigation panel. leftSidebarTreeCustomPage Character
Show child indicators Show child indicators. leftSidebarTreeShowChildIndicators Boolean
Alternating row colors Alternating row colors. leftSidebarTreeAlternatingColors Boolean
Double click to select Check this if you want the selection delegate to be called on a double-click rather than a single click. leftSidebarTreeDoubleClick Boolean
Column headers Specify a comma separated list of column headers. leftSidebarTreeColumnHeaders Character
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.
leftSidebarTreeDataSource Character
Selection column When using a multi column TreeGrid, specify the column you want to select when calling the selection delegate. leftSidebarTreeSelectionColumn Character
Item sync expression Specify an expression to evaluate to keep the TreeGrid in sync while data is navigated in the page. leftSidebarTreeItemExpr Character
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.
navTreeSelectionAction Character
Show ActionBar Show the actionbar at the bottom of the Navigation panel (True | False). navTreeActionbarVisible Boolean
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").
navTreeAddAction Character
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").
navTreeDeleteAction Character
Row height Row height for the Tree items in the Navigation panel. leftSidebarTreeRowheight Int
Font size Font size for the Tree items in the Navigation panel. leftSidebarTreeFontsize Int
CSS style CSS style for the Navigation panel and its Tree (separate attributes with ; or use app:/filename.css). leftSidebarTreeStylesheet Character

Right Sidebar

Attribute Description Name Type
Show right sidebar Show right sidebar (True | False). rightSidebarVisible Boolean
Collapse right sidebar Collapse right sidebar when the App is first loaded (True | False). collapseRightSidebar Boolean
Width Right sidebar width. rightSidebarWidth Int
Background color Right sidebar background color. rightSidebarBackColor Character
Foreground color Right sidebar foreground color. rightSidebarForeColor Character
Border color Right sidebar border color. rightSidebarBorderColor Character
Custom content gadget Gadget based on custom script.
+ Show Show the custom content gadget (True | False). rightSidebarCustomGadgetVisible Boolean
+ Expanded Expand the custom content gadget when the App is first loaded (True | False). rightSidebarCustomGadgetExpanded Boolean
+ Height Custom content gadget height. rightSidebarCustomGadgetHeight Int
+ Stretch Stretch the custom content into the right sidebar (True | False). rightSidebarCustomGadgetStretch Boolean
+ Caption Custom content gadget caption. rightSidebarCustomGadgetCaption Character
+ Gadget The gadget to be displayed. rightSidebarCustomGadget Character
+ Refresh interval The interval in seconds that the content will be refreshed. rightSidebarCustomGadgetRefreshInterval Int
Content gadget #1 Gadget based on URL.
+ Show Show the gadget (True | False). rightSidebarContentVisible1 Boolean
+ Expanded Expand the gadget when the App is first loaded (True | False). rightSidebarContentExpanded1 Boolean
+ Height Gadget height. rightSidebarContentHeight1 Int
+ Caption Gadget caption. rightSidebarContentCaption1 Character
+ URL The URL of the content to be displayed. rightSidebarContentUrl1 Character
+ Refresh interval The interval in seconds that the content will be refreshed. rightSidebarcontentInterval1 Int
Content gadget #2 Gadget based on URL.
+ Show Show the gadget (True | False). rightSidebarContentVisible2 Boolean
+ Expanded Expand the gadget when the App is first loaded (True | False). rightSidebarContentExpanded2 Boolean
+ Height Gadget height. rightSidebarContentHeight2 Int
+ Caption Gadget caption. rightSidebarContentCaption2 Character
+ URL The URL of the content to be displayed. rightSidebarContentUrl2 Character
+ Refresh interval The interval in seconds that the content will be refreshed. rightSidebarcontentInterval2 Int
Content gadget #3 Gadget based on URL.
+ Show Show the gadget (True | False). rightSidebarContentVisible3 Boolean
+ Expanded Expand the gadget when the App is first loaded (True | False). rightSidebarContentExpanded3 Boolean
+ Height Gadget height. rightSidebarContentHeight3 Int
+ Caption Gadget caption. rightSidebarContentCaption3 Character
+ URL The URL of the content to be displayed. rightSidebarContentUrl3 Character
+ Refresh interval The interval in seconds that the content will be refreshed. rightSidebarcontentInterval3 Int
Content gadget #4 Gadget based on URL.
+ Show Show the gadget (True | False). rightSidebarContentVisible4 Boolean
+ Expanded Expand the gadget when the App is first loaded (True | False). rightSidebarContentExpanded4 Boolean
+ Height Gadget height. rightSidebarContentHeight4 Int
+ Caption Gadget caption. rightSidebarContentCaption4 Character
+ URL The URL of the content to be displayed. rightSidebarContentUrl4 Character
+ Refresh interval The interval in seconds that the content will be refreshed. rightSidebarcontentInterval4 Int

Custom Delegates

Attribute Description Name Type
Scripting language The default scripting language for custom code in this page (Inherit | Recital | Visual FoxPro | Python | JavaScript | PHP). scriptingLanguage Character
Custom library The filename of the library containing code for event handlers and custom procedures/functions. customLibrary Character
Print The delegate for the Print event. This is called when you click the 'Print' icon. From v4.2. printAction Character
Hotkey The delegate for the Hotkey event. hotkeyAction Character
Enabled When The delegate for the EnabledWhen event. enabledWhenAction Character
Visible When The delegate for the VisibleWhen event. visibleWhenAction Character
Valid When The delegate for the ValidWhen event. validWhenAction Character
Activate The delegate for the Activate event. activateAction Character
Deactivate The delegate for the Deactivate event. deactivateAction Character
Init The delegate for the Init event. initAction Character
Destroy The delegate for the Destroy event. destroyAction Character
Load The delegate for the Load event. loadAction Character
Ready The delegate for the Ready event. readyAction Character
Unload The delegate for the Unload event. unloadAction Character
Change The delegate for the Change event. changedAction Character
Statechanged The delegate for the Statechanged event. stateChangedAction Character
After Refresh action The delegate for the AfterRefresh event. afterRefreshAction Character
Timer The delegate for the Timer event. timerAction Character
Timer interval The timer interval in seconds that the Timer event will be called at runtime. timerInterval Int
Custom menu The delegate for the Custom menu event. customMenuAction Character
Custom search The delegate for the Search event. customSearch Character
Instant search The delegate for the Instant Search event. The text typed in the searchbox is passed as a parameter. searchAction Character
Dialog button delegate The delegate for the DialogButtonClicked event. If a dialogbutton on a Field has no delegate, the Section delegate will be called. If the Section has no delegate, then the Page delegate will be called. dialogButtonAction Character

Gestures

Attribute Description Name Type
Swipe navigation Enable swipe left and swipe right to navigate between Pages (True | False). swipeNavigation Boolean
Gestures enabled Enable gestures for this page: swipe, pan, pinch, tap and tapandhold (True | False).
If enabled, then the Gestures delegate will be called with two arguments, e.g. 'swipe','left' or 'swipe','right'.
gesturesEnabled Boolean
Swipe left gesture The delegate for the gestureSwipeLeft event. gestureSwipeLeftAction Character
Swipe right gesture The delegate for the gestureSwipeRight event. gestureSwipeRightAction Character
Swipe up gesture The delegate for the gestureSwipeUp event. gestureSwipeUpAction Character
Swipe down gesture The delegate for the gestureSwipeDown event. gestureSwipeDownAction Character
Pan gesture The delegate for the gesturePan event. gesturePanAction Character
Pinch gesture The delegate for the gesturePinch event. gesturePinchAction Character
Tap gesture The delegate for the gestureTap event. gestureTapAction Character
Tap and hold gesture The delegate for the gestureTapAndHold event. gestureTapAndHoldAction Character
Gestures The catch all delegate for the gestures event. gesturesAction Character

Custom Actions

Attribute Description Name Type
Add action The custom action function for Add.
This will be called to add a record.
addAction Character
Delete action The custom action function for Delete.
This will be called to delete a record.
deleteAction Character
Refresh action The custom action function for Refresh.
This will be called to refresh the current record.
refreshAction Character
First action The custom action function for First.
This will be called to read the first record.
firstAction Character
Previous action The custom action function for Previous.
This will be called to read the previous record.
previousAction Character
Next action The custom action function for Next.
This will be called to read the next record.
nextAction Character
Last action The custom action function for Last.
This will be called to read the last record.
lastAction Character
Edit action The custom action function for Edit.
This will be called to edit the current record.
editAction Character
Save action The custom action function for Save.
This will be called to save changes.
saveAction Character
Cancel action The custom action function for Cancel.
This will be called to cancel changes.
cancelAction Character

Permissions and Roles

Attribute Description Name Type
Create roles A comma separated list of roles that can perform create operations on data in the page. permcreate Character
Read roles A comma separated list of roles that can read (and view) the page. permRead Character
Update roles A comma separated list of roles that can perform update operations on data in the page. permUpdate Character
Delete roles A comma separated list of roles that can perform delete operations on data in the page. permDelete Character

UI Presentation Rules

Attribute Description Name Type
Desktop Include this page in a Desktop client (True | False). desktopUI Boolean
Web Include this page in a Web client (True | False). webUI Boolean
Tablet Include this page in a Tablet client (True | False). tabletUI Boolean
Phone Include this page in a Phone client (True | False). mobileUI Boolean
Use mobile navigation bar Use a mobile styled navigation bar (material UI style) (True | False). mobilenavbar Boolean
UI States UI states that affect this page. Specify multiple states as a comma separated list. state Character
Initial UI state The initial UI state for this page. This will be applied to the page and all its sections and fields. uiStateInit Character
Readonly when Page is readonly at runtime if specified expression evaluates to true. readonlyWhen Character
Visible when Page is visible at runtime if specified expression evaluates to true. visibleWhen Character
Page transition effect The page transition effect when navigating between pages on Web/Tablet/Phone. (None | Fade | Pop | Flip | Turn | Flow | SlideFade | Slide | SlideUp | SlideDown). pageTransition Character
Apply rules on change Apply UI presentation rules (Visible when and Readonly when) when data is changed interactively or when navigating records (True | False). applyRulesOnChange Boolean

Page Center Tile

Attribute Description Name Type
Category The category in which the Tile should be displayed in the Page Center. tileCategory Character
Tile caption The caption for the Tile in the Page Center. tileCaption Character
Tile icon The icon for the Tile in the Page Center. tileIcon Character
Tile size The size of the Tile in the Page Center. tileSize Character
Tile order The order of the Tile in the Page Center (from v4.0). tileOrder Int
Background color The background color for the Tile displayed in the Page Center. tileBackColor Character
Foreground color The foreground color for the Tile displayed in the Page Center. tileForeColor Character