cpr.controls.Container
Container/Group
A control that allows you to create a set of controls.
Index
Event |
Description |
animationend |
Event that occurs after the animation ends. |
animationstart |
Event that occurs at the start of the animation. |
before-context-value-change |
Use a bind context in a control that has a bind context
An event that occurs before the value changes. |
before-draw |
This event is called just before group content is drawn. |
click |
An event that occurs when the user clicks the control. |
context-value-change |
Use a bind context in a control that has a bind context
An event that occurs after the value changes. |
contextmenu |
When the right mouse button is clicked or the context menu key is pressed,
Event called. |
dblclick |
An event that occurs when the user double-clicks the control. |
dispose |
The event that is called when the control is dispose. |
dragenter |
When the mouse pointer enters the elements included in the control while dragging
Events that occur. |
dragleave |
During the drag, the mouse pointer may have exited the elements contained in the control. |
dragover |
While dragging the source control with the mouse, the mouse pointer
An event that occurs when moving within a region. |
drop |
Drag the source control to the target control while dragging the source control with the mouse. |
focusin |
Just before the control and its sub-elements gain focus
The event that occurs. |
focusout |
Occurs just before the control's child elements below the control lose focus
event. |
keydown |
Event raised when the user presses a key. |
keyup |
Event that occurs when the user releases the key. |
measure-size |
Event raised when calculating control size |
mousedown |
When the user presses the mouse button with the pointer over the control
Occurs when an event occurs. |
mouseenter |
An event that occurs when the mouse pointer enters the control. |
mouseleave |
If the user moves the mouse pointer beyond the control and its children
Events that occur when moving. |
mousemove |
This event is raised when the user moves the pointer over the control. |
mouseup |
The user releases the mouse button while over the control. |
transitionend |
Event that fires after CSS property transition ends. |
transitionstart |
Event that fires when CSS property transition starts. |
Name |
Type |
Description |
accessbility |
Accessbility |
Gets the accessibility-related ARIA properties or gets the context in which they can be specified. |
childCombinatorClass |
String |
Get a class for the combinator to select direct children. |
clipContent |
Boolean |
Gets whether clipping is applied. |
disposed |
Boolean |
Returns whether the control should be removed. |
editable |
Boolean |
Returns whether the value can be changed by user action. |
enabled |
Boolean |
Returns whether the control is enabled. |
fieldLabel |
String |
Returns the logical field name of the control. |
focusable |
Boolean |
Returns whether the control is focusable. |
focused |
Boolean |
Returns whether the control has focus. |
id |
String |
Returns the ID of the control. |
isAppContainer |
Boolean |
Returns whether it is an AppContainer. |
name |
String |
Returns the name of the control. |
overscrollBehavior |
OverscrollBehaviorType |
Returns a value that defines the parent's scrolling behavior when the end of the scrollable area is reached by the mouse wheel or touch event. |
readOnly |
Boolean |
Returns whether a non-modifiable read-only mode is in effect. |
style |
UIControlStyler |
Returns the style settings of the control. |
tooltip |
String |
Returns a description of the control |
type |
ControlType |
Returns the signature string of the Control's unique Type that can distinguish the Control. |
uuid |
String |
Returns the unique ID of the control. |
visible |
Boolean |
Returns the style property for controlling css visibility. |
Constructor
Create a group.
name |
type |
description |
idoptional
|
String |
group id |
Events
CValueChangeEvent Use a bind context in a control that has a bind context
An event that occurs before the value changes.
CUIEvent This event is called just before group content is drawn.
It is only used for dynamically constructing internal content.
CMouseEvent An event that occurs when the user clicks the control.
CValueChangeEvent Use a bind context in a control that has a bind context
An event that occurs after the value changes.
CMouseEvent When the right mouse button is clicked or the context menu key is pressed,
Event called.
CMouseEvent An event that occurs when the user double-clicks the control.
CEvent The event that is called when the control is dispose.
CMouseEvent When the mouse pointer enters the elements included in the control while dragging
Events that occur.
CMouseEvent During the drag, the mouse pointer may have exited the elements contained in the control.
The event that occurs when.
CMouseEvent While dragging the source control with the mouse, the mouse pointer
An event that occurs when moving within a region.
CMouseEvent Drag the source control to the target control while dragging the source control with the mouse.
Event that fires when dropping.
CFocusEvent Just before the control and its sub-elements gain focus
The event that occurs.
CFocusEvent Occurs just before the control's child elements below the control lose focus
event.
CKeyboardEvent Event raised when the user presses a key. Keycode related constants can be referenced at
KeyCode.
CKeyboardEvent Event that occurs when the user releases the key. Keycode related constants can be referenced at
KeyCode.
CMouseEvent When the user presses the mouse button with the pointer over the control
Occurs when an event occurs.
CMouseEvent An event that occurs when the mouse pointer enters the control.
CMouseEvent If the user moves the mouse pointer beyond the control and its children
Events that occur when moving.
CMouseEvent This event is raised when the user moves the pointer over the control.
CMouseEvent The user releases the mouse button while over the control.
When an event occurs.
Properties
declaring type
|
UIControl |
type
|
Accessbility |
readonly
|
Gets the accessibility-related ARIA properties or gets the context in which they can be specified.
|
type
|
String |
get
|
Get a class for the combinator to select direct children.
|
set
|
Specifies the class for the combinator to select immediate children.
|
type
|
Boolean |
get
|
Gets whether clipping is applied.
|
set
|
Specifies whether clipping is applied when child controls leave the area of this container.
If you have a layout configured to display scroll bars, this property is ignored.
|
declaring type
|
Control |
type
|
Boolean |
readonly
|
Returns whether the control should be removed.
|
declaring type
|
UIControl |
type
|
Boolean |
readonly
|
Returns whether the value can be changed by user action.
UIControl (Output, etc.) that does not allow input returns false.
In the case of an inputtable UIControl, returns true if the binding context in which the value is bound is valid.
Otherwise, it returns false even if it is an inputtable UIControl.
Accordion/Button/Group/Dialog/EmbeddedApp/EmbeddedPage/Grid/HTMLObject/Image/MDIFolder/Menu/
NavigationBar/Notifier/Output/Progress/TabFolder/Shell/FileUpload
In the case of the above control, editable is always false.
|
declaring type
|
EnableUIControl |
type
|
Boolean |
get
|
Returns whether the control is enabled.
|
set
|
Sets whether to activate the control.
|
declaring type
|
UIControl |
type
|
String |
get
|
Returns the logical field name of the control.
|
set
|
Sets the logical field name of the control.
|
declaring type
|
UIControl |
type
|
Boolean |
readonly
|
Returns whether the control is focusable.
|
declaring type
|
UIControl |
type
|
Boolean |
readonly
|
Returns whether the control has focus.
|
declaring type
|
Control |
type
|
String |
readonly
|
Returns the ID of the control.
|
type
|
Boolean |
readonly
|
Returns whether it is an AppContainer.
|
declaring type
|
UIControl |
type
|
String |
get
|
Returns the name of the control.
|
set
|
Sets the name of the control.
|
type
|
OverscrollBehaviorType |
get
|
Returns a value that defines the parent's scrolling behavior when the end of the scrollable area is reached by the mouse wheel or touch event.
The default value is AUTO, which delegates scrolling behavior to the parent.
|
set
|
Sets a value that defines the parent's scrolling behavior when the end of the scrollable area is reached by the mouse wheel or touch event.
OverscrollBehaviorType.AUTO: Delegates scrolling behavior to parent.
OverscrollBehaviorType.NONE: Blocks propagation to the parent.
|
declaring type
|
EnableUIControl |
type
|
Boolean |
get
|
Returns whether a non-modifiable read-only mode is in effect.
|
set
|
Sets whether to enable read-only mode, which can not be modified.
|
declaring type
|
UIControl |
type
|
UIControlStyler |
readonly
|
Returns the style settings of the control.
In case of style changes, only the corresponding control is updated.
Propagation from style changes does not occur.
|
declaring type
|
VisibleUIControl |
type
|
String |
get
|
Returns a description of the control
It works when mouse over.
|
set
|
Set a description for the control.
It works when mouse over.
|
declaring type
|
Control |
type
|
ControlType |
readonly
|
Returns the signature string of the Control's unique Type that can distinguish the Control.
Please refer to ControlType for available constant values.
For UDC controls, each unique type name is returned. Example: udc.MyUDC
|
declaring type
|
Control |
type
|
String |
readonly
|
Returns the unique ID of the control.
|
declaring type
|
VisibleUIControl |
type
|
Boolean |
get
|
Returns the style property for controlling css visibility.
|
set
|
Sets the style property to control css visibility.
|
Methods
Add controls to this container.
If the container's layout is responsive, you must specify a media query.
name |
type |
description |
child
|
UIControl |
The control to add. |
constraintoptional
|
Constraint |
default{}
|
Layout characteristics. The layout attribute must be in the format specified by the layout specified in the container. |
Add listeners by EventType to the control.
Add a listener to the control to handle when a specific event occurs.
var button = new cpr.controls.Button("btn01");
button.addEventListener("click", function(e) {
// event code...
});
name |
type |
description |
type
|
String |
|
listener
|
(e: cpr.events.CEvent)=>Void |
|
Add a listener to the control that will run only once per EventType.
Add a listener to the control to handle when a specific event occurs.
The added listener is automatically deleted after running once.
Since the object of the added listener is changed, when the listener is deleted
It is an object returned after calling addEventListenerOnce and can be deleted.
var button = new cpr.controls.Button("btn01");
button.addEventListenerOnce("click", function(e) {
// event code...
});
name |
type |
description |
type
|
String |
|
listener
|
(e: cpr.events.CEvent)=>Void |
|
return
|
(e: cpr.events.CEvent)=>Void |
The modified Listener object. |
Adjust the position of the scroll.
name |
type |
description |
leftDelta
|
Number |
Horizontal scroll shift value |
topDelta
|
Number |
Vertical scroll shift value |
durationoptional
|
Number |
default0
|
Animation operation time. (Unit: second) default = 0 |
timingFunctionoptional
|
String |
defaultanimation.TimingFunction.EASE_IN_OUT
|
Timing function. default = animation.TimingFunction.EASE_IN_OUT |
Bind that property.
name |
type |
description |
name
|
String |
|
Removes focus from the control.
Determines whether to run the Control's Default Event Handler depending on the state of the Control.
name |
type |
description |
e
|
CEvent |
event |
return
|
Boolean |
Whether the control's event handler is running. |
Forwards specific events.
name |
type |
description |
e
|
CEvent |
|
return
|
Boolean |
Whether to continue processing the default action after propagating the event. |
Removes the objects that the control contains.
Find the parent control.
If includeSelf is true, the parent including the self is found.
name |
type |
description |
predicate
|
(c: cpr.controls.UIControl)=>Boolean |
|
includeSelfoptional
|
Boolean |
defaultfalse
|
Whether you include yourself. |
It is included at the end of the container and is not affected by the layout. Use Container.removeChild to delete the control.
name |
type |
description |
child
|
UIControl |
Control to plot |
stylesoptional
|
{[key:string]: String} |
default{}
|
A style or cpr.geometry.Rectangle object that describes the position of the control to be displayed. |
Assigns focus to the control.
name |
type |
description |
forwardoptional
|
Boolean |
defaulttrue
|
|
Moves focus to the next control.
If there are multiple structural elements that have focus inside a control, focus may transition to the next element.
Moves focus to the previous control.
If there are multiple structural elements that have focus inside a control, focus may transfer to the previous element.
Gets the bounds value of the control relative to the browser's view port.
If the control is not drawn on the screen, an object with all values of 0 is returned.
return
|
Rectangle |
About the position and size of controls in the HTML DOM |
Gets the bounds value of the control relative to the browser's view port.
If the control is not drawn on the screen, an object with all values of 0 is returned.
name |
type |
description |
includeWrap
|
Boolean |
If this value is true, the layout of the parent group gets the area of the node surrounding this control. If false, only get the area of the control node. |
return
|
Rectangle |
About the position and size of controls in the HTML DOM |
Gets the bounds value of the control relative to the browser's view port.
If the control is not drawn on the screen, an object with all values 0 is returned.
name |
type |
description |
options
|
{
includeWrap?: Boolean,
scaled?: Boolean
} |
|
Recursively gets all child controls contained in this container and all controls contained in subcontainers.
Internal elements such as embedded apps and UDCs are not included in the returned results.
name |
type |
description |
includeSelfoptional
|
Boolean |
defaultfalse
|
Whether to include itself in the return value. |
Recursively gets all child controls contained in this container and all controls contained in subcontainers.
Internal elements such as embedded apps and UDCs are not included in the returned results.
name |
type |
description |
includeSelfoptional
|
Boolean |
defaultfalse
|
Whether to include itself in the return value. |
Returns the App to which the control belongs.
Returns the bind context.
Returns the bind property information for the control.
name |
type |
description |
name
|
String |
|
Get the immediate child controls within the container by ID.
name |
type |
description |
childId
|
String |
The ID of the child control to get. |
return
|
UIControl |
Any of the immediate child controls that match the given ID. Returns null if it doesn't exist. |
Get all child controls.
return
|
UIControl[] |
An array of child controls. |
Returns the number of child controls.
return
|
Number |
Number of child controls |
Gets the layout attributes of that control.
name |
type |
description |
child
|
UIControl |
Child controls to get layout attributes. |
return
|
Constraint |
The layout attributes of its child controls. |
I get the whole child area.
Get the first child control.
Returns all custom DOM DATA attribute names.
return
|
String[] |
An array of all custom DOM DATA attribute names. |
The last child gets control.
Returns the control to be moved by Tab Key or by the autoskip property.
The area being displayed is obtained based on the parent container to which it belongs.
name |
type |
description |
includeWrapoptional
|
Boolean |
defaultfalse
|
If this value is true, the layout of the parent group gets the area of the node surrounding this control. If false, only get the area of the control node. |
Shift + Tab Returns the focus to be moved through the key.
Returns all custom attribute names.
return
|
String[] |
An array of all custom attribute names. |
Gets the scrolling viewport area being displayed inside the container.
name |
type |
description |
optionsoptional
|
{
scaled?: Boolean
} |
|
Gets the closest parent UI control.
Unlike getParent(), it finds nearby parent controls, including external apps.
Specifies custom DOM properties.
name |
type |
description |
key
|
String |
The attribute name to assign |
value
|
String |
The attribute value to specify. |
Returns a custom DOM property.
name |
type |
description |
key
|
String |
The attribute name to get. |
return
|
String |
Custom properties. |
Specify multiple custom DOM properties at once.
name |
type |
description |
values
|
{[key:string]: String} |
A JSON object containing custom attribute keys/values. |
Get all custom DOM properties in the form of a map.
return
|
{[key:string]: String} |
|
Add child controls to a specific index.
name |
type |
description |
index
|
Number |
Index to add child |
child
|
UIControl |
Child control. |
constraintoptional
|
Constraint |
default{}
|
The layout attributes of the child control. |
Returns whether the queried property is bindable and the binding has been configured to obtain a valid value.
Even if no binding is configured and a simple value is specified, it is treated as configured so that a valid value is obtained.
For example, binding to a row index that does not exist in the DataSet is an invalid binding.
name |
type |
description |
name
|
String |
|
Make sure it is a bindable property.
name |
type |
description |
name
|
String |
|
return
|
Boolean |
Confirmation. |
Returns whether the control is floating through an app instance or a specific container.
Returns the status that the screen is showing. Returns false if the visible state of all parents including itself is false.
Converts browser viewport base coordinates to relative coordinates for this container.
name |
type |
description |
actualLocation
|
Point |
Coordinate to convert |
Converts to the relative coordinates for this container based on the browser viewport bounce object.
name |
type |
description |
actualRect
|
Rectangle |
Rectangle object to get relative coordinates. |
Removes all child controls.
name |
type |
description |
shouldDisposeoptional
|
Boolean |
defaultfalse
|
Whether control objects are removed. |
Removes all event listeners for the control.
Delete all custom DOM DATA attributes.
Delete all custom attributes.
Remove the control.
name |
type |
description |
childControl
|
UIControl |
The control you want to remove. |
shouldDisposeoptional
|
Boolean |
defaultfalse
|
Whether control objects are removed. |
Remove Listener for each EventType in the control.
control.removeEventListener ('click', listener); code> pre>
name |
type |
description |
type
|
String |
Event type. |
listener
|
(e: cpr.events.CEvent)=>Void |
Event listeners. |
Remove all EventType listeners from the control.
control.removeEventListeners ('click'); code> pre>
name |
type |
description |
type
|
String |
Event type. |
Removes the user-defined DOM DATA attribute for a specific attribute name.
name |
type |
description |
key
|
String |
The custom DOM DATA attribute name to remove. |
Removes user-defined attributes for a specific attribute name.
name |
type |
description |
key
|
String |
The custom attribute name to remove. |
Change the order of the children of the container. You can change the order to determine the priority that appears when overlapping between controls.
name |
type |
description |
child
|
UIControl |
Child controls of container |
newIndex
|
Number |
The new index. |
isFutureIndexoptional
|
Boolean |
defaultfalse
|
Whether the new index is the index of the child after control relocation.
If this value is false , the new index will be interpreted relative to the current state.
If this value is true , the new index is interpreted as the index after method execution. |
Replaces an existing child control with a new control.
If the given existing control does not exist, it does nothing.
name |
type |
description |
oldChild
|
UIControl |
Existing controls to be removed. |
newChild
|
UIControl |
The control to replace. |
constraintsoptional
|
Constraint |
default{}
|
Layout characteristics. |
return
|
{
key: cpr.controls.UIControl,
value: cpr.controls.layouts.Constraint
} |
New control information. Returns null if no replacement operation has occurred because the existing control does not exist. |
Replaces the layout attributes of a control.
name |
type |
description |
child
|
UIControl |
The control whose layout attributes you want to change. |
newConstraint
|
Constraint |
New layout properties.
The layout attribute must be in a format supported by the layout of the Container to which the control belongs. |
return
|
Boolean |
Whether a given layout property and changes exist. |
If the container contains scrolling, scrolls to display a specific child.
name |
type |
description |
child
|
UIControl |
Child controls to display. |
durationoptional
|
Number |
default0.3
|
The length of the scroll animation. (Unit: second) |
timingFunctionoptional
|
String |
defaultanimation.TimingFunction.EASE_IN_OUT
|
Timing function to be applied when using animation. |
If the container contains scrolling, scroll to that position.
name |
type |
description |
left
|
Number |
X-coordinate to scroll. |
top
|
Number |
Y-coordinate to scroll. |
durationoptional
|
Number |
default0
|
The length of the scroll animation. The unit is seconds. |
timingFunctionoptional
|
String |
defaultanimation.TimingFunction.EASE_IN_OUT
|
Timing function to be applied when using animation. |
Sets the bind context.
container.setBindContext({dataControl:grid.dataSet,rowIndex:rowIndex})
Sets the layout.
name |
type |
description |
layout
|
Layout<Object> |
layout |
Sets the control to be moved by Tab Key or by the autoskip property.
name |
type |
description |
nextControl
|
UIControl |
control. |
Shift + Tab Set the focus to be moved through the key.
name |
type |
description |
prevControl
|
UIControl |
control. |
Unbind that property.
name |
type |
description |
name
|
String |
|
Updates the layout attributes of a control.
Predefined layout characteristics and newly given characteristics are merged.
name |
type |
description |
child
|
UIControl |
The control whose layout attributes are to be updated. |
overridingConstraint
|
Constraint |
Layout attributes to add or change. |
return
|
Boolean |
Whether there are changes from the given layout properties after the update. |
Specifies custom properties.
name |
type |
description |
key
|
String |
The attribute name to assign |
value
|
String |
The attribute value to specify. |
Returns a user-defined property.
name |
type |
description |
key
|
String |
The attribute name to get. |
return
|
String |
Custom properties. |
Specify multiple custom properties at once.
name |
type |
description |
values
|
{[key:string]: String} |
A JSON object containing custom attribute keys/values. |
Get all custom properties in the form of a map.
return
|
{[key:string]: String} |
|
Specifies custom data. Unlike user-defined attributes, you can use arbitrary types in addition to strings.
When the control is dispose, all custom data is removed.
name |
type |
description |
key
|
String |
The key of the data to be specified. |
value
|
Object |
Data to specify. |
get custom data
name |
type |
description |
key
|
String |
The key of the data to get. |
Specifies multiple user-defined data.
name |
type |
description |
override
|
{[key:string]: Object} |
A JSON object containing user-defined data. |
Get all your custom data.
return
|
{[key:string]: Object} |
|
Returns a user-defined property.
return
|
Object |
Custom properties. |