# JSResponsiveLayoutContainer ## Properties Summarized | Type | Name | Summary | | ----------------------------------------------------------------------- | --------------------------- | ------------------------------------------------------------------------------------------------- | | [String](/reference/servoycore/dev-api/js-lib/string.md) | [cssClasses](#cssclasses) | The css classes to be output for html tag. | | [CSSPosition](/reference/servoycore/dev-api/application/cssposition.md) | [cssPosition](#cssposition) | CSS position is a replacement for anchoring system making it more intuitive to place a component. | ## Methods Summarized | Type | Name | Summary | | --------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- | | [String](/reference/servoycore/dev-api/js-lib/string.md) | [getAttribute(name)](#getattribute-name) | | | [String](/reference/servoycore/dev-api/js-lib/string.md) | [getComment()](#getcomment) | Returns the comment of this component. | | [JSResponsiveLayoutContainer](/reference/servoycore/dev-api/solutionmodel/jsresponsivelayoutcontainer.md) | [getResponsiveLayoutContainer(name)](#getresponsivelayoutcontainer-name) | Returns a JSResponsiveLayoutContainer that has the given name of this container. | | [Array](/reference/servoycore/dev-api/js-lib/array.md) | [getResponsiveLayoutContainers(returnInheritedElements)](#getresponsivelayoutcontainers-returninheritedelements) | Returns all JSResponsiveLayoutContainer objects of this container | | [UUID](/reference/servoycore/dev-api/application/uuid.md) | [getUUID()](#getuuid) | Returns the UUID of this component. | | [JSComponent](/reference/servoycore/dev-api/solutionmodel/jscomponent.md) | [getWebComponent(name)](#getwebcomponent-name) | Returns a JSWebComponent that has the given name that is a child of this form, layout container or responsive layout container. | | [Array](/reference/servoycore/dev-api/js-lib/array.md) | [getWebComponents(returnInheritedElements)](#getwebcomponents-returninheritedelements) | Returns all JSWebComponents of this form/container. | | [JSResponsiveLayoutContainer](/reference/servoycore/dev-api/solutionmodel/jsresponsivelayoutcontainer.md) | [newResponsiveLayoutContainer(position)](#newresponsivelayoutcontainer-position) | Create a new responsive layout container. | | [JSComponent](/reference/servoycore/dev-api/solutionmodel/jscomponent.md) | [newWebComponent(name, type, position)](#newwebcomponent-name-type-position) | Creates a new JSWebComponent (spec based component) object on the RESPONSIVE container(form , layout container or responsive layout container). | | void | [putAttribute(key, value)](#putattribute-key-value) | | | void | [remove()](#remove) | Remove a layout container (with all its children) from hierarchy. | | [Boolean](/reference/servoycore/dev-api/js-lib/boolean.md) | [removeWebComponent(name)](#removewebcomponent-name) | Removes a JSWebComponent that has the specified name. | ## Properties Detailed ### cssClasses The css classes to be output for html tag. **Type**\ [String](/reference/servoycore/dev-api/js-lib/string.md) A space-separated string of CSS classes applied to the layout container. **Sample** ```js layoutContainer.cssClasses = 'myContainer'; ``` ### cssPosition CSS position is a replacement for anchoring system making it more intuitive to place a component.\ CSS position should be set on form, an absolute position form can either work with anchoring or with css position.\ This is only working in NGClient. **Type**\ [CSSPosition](/reference/servoycore/dev-api/application/cssposition.md) The CSS position of the component. **Sample** ```js var label = form.newLabel('Label', -1); label.cssPosition.r("10").b("10").w("20%").h("30px") ``` ## Methods Detailed ### getAttribute(name) **Parameters** * [String](/reference/servoycore/dev-api/js-lib/string.md) **name** the attributes name **Returns:** [String](/reference/servoycore/dev-api/js-lib/string.md) The value of the specified attribute, or null if the attribute is not set. **Sample** ```js layoutContainer.getAttribute('class'); ``` ### getComment() Returns the comment of this component. **Returns:** [String](/reference/servoycore/dev-api/js-lib/string.md) the comment associated with this component. **Sample** ```js var comment = solutionModel.getForm("my_form").getButton("my_button").getComment(); application.output(comment); ``` ### getResponsiveLayoutContainer(name) Returns a JSResponsiveLayoutContainer that has the given name of this container. **Parameters** * [String](/reference/servoycore/dev-api/js-lib/string.md) **name** the specified name of the container **Returns:** [JSResponsiveLayoutContainer](/reference/servoycore/dev-api/solutionmodel/jsresponsivelayoutcontainer.md) a JSResponsiveLayoutContainer object **Sample** ```js var container = myForm.getResponsiveLayoutContainer("row1"); application.output(container.name); ``` ### getResponsiveLayoutContainers(returnInheritedElements) Returns all JSResponsiveLayoutContainer objects of this container **Parameters** * [Boolean](/reference/servoycore/dev-api/js-lib/boolean.md) **returnInheritedElements** true to also return the elements from parent form **Returns:** [Array](/reference/servoycore/dev-api/js-lib/array.md) all JSResponsiveLayoutContainer objects of this container **Sample** ```js var frm = solutionModel.getForm("myForm"); var containers = frm.getResponsiveLayoutContainers(); for (var c in containers) { var fname = containers[c].name; application.output(fname); } ``` ### getUUID() Returns the UUID of this component. **Returns:** [UUID](/reference/servoycore/dev-api/application/uuid.md) the UUID of this component. **Sample** ```js var button_uuid = solutionModel.getForm("my_form").getButton("my_button").getUUID(); application.output(button_uuid.toString()); ``` ### getWebComponent(name) Returns a JSWebComponent that has the given name that is a child of this form, layout container or responsive layout container.\ Use findWebComponent() to find a webcomponent through the hierarchy **Parameters** * [String](/reference/servoycore/dev-api/js-lib/string.md) **name** the specified name of the web component **Returns:** [JSComponent](/reference/servoycore/dev-api/solutionmodel/jscomponent.md) a JSWebComponent object **Sample** ```js var btn = container.getWebComponent("mycomponent"); application.output(mybean.typeName); ``` ### getWebComponents(returnInheritedElements) Returns all JSWebComponents of this form/container.\ If this method is called on a form, then it will return all web components on that form.\ If the form is responsive, it will return the web components from all the containers. **Parameters** * [Boolean](/reference/servoycore/dev-api/js-lib/boolean.md) **returnInheritedElements** true to also return the elements from parent form **Returns:** [Array](/reference/servoycore/dev-api/js-lib/array.md) the list of all JSWebComponents on this forms **Sample** ```js var webComponents = myForm.getWebComponents(false); for (var i in webComponents) { if (webComponents[i].name != null) application.output(webComponents[i].name); } ``` ### newResponsiveLayoutContainer(position) Create a new responsive layout container. The position is used to determine the generated order in html markup. **Parameters** * [Number](/reference/servoycore/dev-api/js-lib/number.md) **position** the position of responsive layout container object in its parent container **Returns:** [JSResponsiveLayoutContainer](/reference/servoycore/dev-api/solutionmodel/jsresponsivelayoutcontainer.md) the new responsive layout container **Sample** ```js var container = container.newResponsiveLayoutContainer(1); ``` ### newWebComponent(name, type, position) Creates a new JSWebComponent (spec based component) object on the RESPONSIVE container(form , layout container or responsive layout container). **Parameters** * [String](/reference/servoycore/dev-api/js-lib/string.md) **name** the specified name of the JSWebComponent object * [String](/reference/servoycore/dev-api/js-lib/string.md) **type** the webcomponent name as it appears in the spec * [Number](/reference/servoycore/dev-api/js-lib/number.md) **position** the position of JSWebComponent object in its parent container **Returns:** [JSComponent](/reference/servoycore/dev-api/solutionmodel/jscomponent.md) a JSWebComponent object **Sample** ```js var form = solutionModel.newForm('newForm1', 'db:/server1/table1', null, true, 800, 600); var container = myForm.getLayoutContainer("row1") var bean = container.newWebComponent('bean','mypackage-testcomponent',1); ``` ### putAttribute(key, value) **Parameters** * [Object](/reference/servoycore/dev-api/js-lib/object.md) **key** ; * [String](/reference/servoycore/dev-api/js-lib/string.md) **value** ; **Returns:** void **Sample** ```js layoutContainer.putAttribute('class','container fluid'); ``` ### remove() Remove a layout container (with all its children) from hierarchy. **Returns:** void **Sample** ```js layoutContainer.remove(); ``` ### removeWebComponent(name) Removes a JSWebComponent that has the specified name. Returns true if removal was successful, false otherwise. **Parameters** * [String](/reference/servoycore/dev-api/js-lib/string.md) **name** the specified name of the JSWebComponent to be removed **Returns:** [Boolean](/reference/servoycore/dev-api/js-lib/boolean.md) true if the JSWebComponent has been removed; false otherwise **Sample** ```js var form = solutionModel.getForm('myform'); form.removeWebComponent('mybean') ``` *** --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jsresponsivelayoutcontainer.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.