Panel

Description

The panel component creates a container for settings that control the visibility of one, or several, components of HTML snippets in an application. For example, a panel can allow only management to view additional form fields and exclude the option for non-management personnel. The panel component is often used with the Hide-Show Component action, which can be assigned to a panel's Before Show event where you specify the condition of when the panel should be shown or hidden.

A panel component can contain any CodeCharge Studio components of a form that are supported by that form. For example, if a panel is added to a CodeCharge Studio form such as grid or record it can contain only form specific components (the Include Page cannot be placed inside the Panel). For a panel to work correctly, it is necessary that the panel does not contain structural elements of other components, such as component sections identified as blocks within the HTML. For example, when using a grid form, the Row and AltRow blocks of the grid are structural and therefore cannot be included into a panel.

Control Access within Panels

From the control access point of view the panel component is transparent. Panels can be considered non-existing when programming visibility of child components. For example, let's assume the following page structure:

Page1
Grid1
Label1
Grid2
Panel1
Label1

The following code is used to specify values of Label1 (PHP):

//Grid1 before show row
$Grid1->Label1->SetValue('new value');
//End of Grid1 before show row
//Grid2 before show row
$Grid2->Label1->SetValue('new value');
//End of Grid2 before show row

You may notice the panel's transparency allows for panels to be easily removed or added to pages without any code adjustments.

Panels vs. Visible property

Many CodeCharge Studio components provide the Visible property that can hide components. Setting this property value to "Dynamic" hides the component programmatically by extending its block definition within the HTML. The Visible property is a viable and simplified solution that allows users to hide components without using panels, however, this method has the following disadvantages:

Difficulty of hiding multiple components simultaneously

Absence of visual representation of hideable components in the Design mode

Limited usability due to unclear scope

The panel component was introduced to overcome the limits of the Visible property of individual components. A panel can contain any number of CodeCharge Studio controls and components that can be hidden/shown simultaneously. Since the panel is a visual component, its boundaries are visible in the Design mode. The panel can be easily added from the Toolbox like any other component. When placed on a page, panels are displayed in the Project Explorer with all components contained within the Panel.

Known Limitations

Values of hidden controls are set to NULL when saving the data, whether controls are hidden directly or via a panel. For example, you may create a record form with certain updateable fields hidden conditionally. When a user submits the form, the Web browser will not submit the non-existing fields. As the result the form that is updated will not receive those control values and will set them to NULL.

When updating existing records this problem can be solved by using custom code to retrieve the previous record value(s) from the database and assigning those values back to the control, for example in the form's Before Build Update event.

When inserting new records this problem can be solved by specifying default values in the control's "Default Value" property.

Alternative solutions will be considered for future versions of CodeCharge Studio.