Welcome, Guest Login

Support Center

Container

Last Updated: Feb 08, 2018 02:55PM EST
Container

Containers are very useful components which let you change the content in a portion of a View without reloading the View.
With Containers you reserve an area in another Layout to display different Blocks based on specific conditions.
What goes inside a Container is define by the Set Container Action.


Tutorial App

Automatically install the "Containers" Tutorial App in your Workspace.

 

1. Set your Container as a Custom Block


From the Block Selector, drop the Container in your View.
Right click on this Container to bring up the Block Editor on the left hand side.
In the Block Editor select the 'General' tab.
Under the MyBlock Name, change the name from Container 1 to "My Container"
- Or other name you like -
 This is how you turn any Block into a Custom Block.



 


2. Set the Block displayed in your Container


The Blocks displayed within Containers are set using the 'Set Container Block' action.
You can call that Action from anywhere and switch the Blocks displayed in your Container from anywhere.
any times that Action is called before you display the View with the Containers but it is also often called from within the View you are in to change a portion of your View without switching to another View.


Example:

In our 'Container' Tutorial App we use a container Block to alternatively display 2 different images in the same area.
This is a very simple example, keep in mind that Container let you switch any Block by any other Block.


To do this we have created  3 Custom Blocks

  • Container itself which we named: "My Container"
  • And one Custom Block for each Image Block, creatively named "1st Image" and "2nd Image" 
On the only view of the app  we only have 3 Elements:
  • 1 Container
  • 2 Text blocks used as Button to switch the content of the Container.
To switch the content of the container we use the 'Set Container' Action
Set Container Action has 2 mandatory parameter:

1. The Container the action is applied to.
2. The Block to be set into the Container.

Because our 2 buttons essentially replace one image block by another the Set container actions are identical.
They look like this in the app:




Learn More
- Selector

Help us improve! Rate this article:

Yes I found this article helpful

Ask a Question   

support@eachscape.com
http://assets1.desk.com/
false
eachscape
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Invalid characters found
/customer/en/portal/articles/autocomplete