Page Include

Simple but powerful, the Page Include component pulls in another (separate) Skuid page into the current Skuid page. While it is a more complex component, the Page Include component unlocks a lot of potential, especially for larger applications:

  • Improve runtime for complex pages by loading specific elements (components and models) only when they are needed.
  • “Componentize” elements of your Skuid apps into separate pages, allowing them to be reused across different parts of the app.
  • More easily configure different parts of a Skuid app: instead of having to burrow into a component’s action script to access a modal or sliding panel and then make changes to it, turn those elements into separate pages and add them to the current page using the Page Include component.

Using the Page Include Component

Note

Page Includes are not “place holders” for pages to be created later. Any pages referenced by a Page Include must be created before adding the Page Include component to the current page.

Once you have decided which additional Skuid page to include in the Skuid page you are currently building:

  • Add a Page Include component to the page.

    • Select whether to use the Page Include to call a Skuid Page or a Page Assignment and configure the appropriate properties.

Warning

Ensure any pages included through this component use the same Design System. If not, the pages may have inconsistent theming and styles.

Properties

(Just need to look up a property? Try going directly to the Property Library.)

Component properties

Troubleshooting

Debugging query strings [[]]

When working with Page Include components, you may need to verify query strings or debug the component in other various ways. Use Chrome Developer Tools (specifically the Network tab):

  1. Open Developer Tools by right clicking the page and selecting Inspect, or using the hot keys (Windows: Ctrl + Shift + I) (Mac: Cmd + Opt + I).
  2. Click the Network tab.
  3. Click the XHR filter.
  4. Look for the request that begins with include?isinclude=true.

The customized parameters from the Query String field (or page assignment parameters if you selected that option) appear here prepended by an ampersand (&). Check the parameters that are sent to the Page Include to find a solution to any issues.