Auto-Scroll Section

Description

The Auto-Scroll Section part allows application end-users to keep a screen's scroll position at the last focused-on position on that screen.

Use

The Auto-Scroll Section part can be added in the code view of a process node. When it is added to a process node, the Auto-Scroll Section part maintains the scroll position on a page when an end-user selects a UI element. To use this part, each form part element to which the auto-scroll should apply must include the CSS class that is defined in the selector field of the Auto Scroll Section part.

Create the part by performing the following actions:

1. Open the logicnet in the LogicNets Designer where you want to use the Auto-Scroll Section part.
2. With your mouse in the logicnet Viewer screen (where you build your logicnets), right-click your mouse.
3. Select add node.
4. Select process.
5. Double-click on the newly added node to open the Editor pane. You may have to increase the size of the pane to see each of the tabs at the top.
6. Click the code tab at the top of the Editor pane.
7. Add the part identified as Example 1 below inside the node parts of the node you created. You may also copy-paste the following lines:
    

   Note: The "selector" field should contain the name of the CSS class that will make specific class objects auto scrollable. In the example above, the CSS class name is "auto_scroll_class".

   {
       _name = "auto_scroll_section",
       selector = ".your_class_name"
   } 

8. Click save.
9. Double-click on the node. In the list of parts associated with this node you will see the part you added (Example 2 from Example Project - see link below).
10. Double-click on the Auto-Scroll Section part in the list of parts for that node and the system will display the Selector field (Example 3 from Example Project - see link below).
11. Enter the name of the CSS class in the Selector field. This replaces the default your_class_name you used to set up the part.

Editor Fields

Example

The following example demonstrates how to use the Auto-Scroll Section part.