# JSResponsiveLayoutContainer ## Properties Summarized | Type | Name | Summary | | ------------------------------------------------------------------------------------------- | --------------------------- | ------------------------------------------------------------------------------------------------- | | [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [cssClasses](#cssclasses) | The css classes to be output for html tag. | | [CSSPosition](https://docs.servoy.com/reference/servoycore/dev-api/application/cssposition) | [cssPosition](#cssposition) | CSS position is a replacement for anchoring system making it more intuitive to place a component. | ## Methods Summarized | Type | Name | Summary | | ----------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- | | [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [getAttribute(name)](#getattribute-name) | | | [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) | [getComment()](#getcomment) | Returns the comment of this component. | | [JSResponsiveLayoutContainer](https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jsresponsivelayoutcontainer) | [getResponsiveLayoutContainer(name)](#getresponsivelayoutcontainer-name) | Returns a JSResponsiveLayoutContainer that has the given name of this container. | | [Array](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/array) | [getResponsiveLayoutContainers(returnInheritedElements)](#getresponsivelayoutcontainers-returninheritedelements) | Returns all JSResponsiveLayoutContainer objects of this container | | [UUID](https://docs.servoy.com/reference/servoycore/dev-api/application/uuid) | [getUUID()](#getuuid) | Returns the UUID of this component. | | [JSComponent](https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jscomponent) | [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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/array) | [getWebComponents(returnInheritedElements)](#getwebcomponents-returninheritedelements) | Returns all JSWebComponents of this form/container. | | [JSResponsiveLayoutContainer](https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jsresponsivelayoutcontainer) | [newResponsiveLayoutContainer(position)](#newresponsivelayoutcontainer-position) | Create a new responsive layout container. | | [JSComponent](https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jscomponent) | [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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean) | [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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) 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](https://docs.servoy.com/reference/servoycore/dev-api/application/cssposition) 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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) **name** the attributes name **Returns:** [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) 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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) 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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) **name** the specified name of the container **Returns:** [JSResponsiveLayoutContainer](https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jsresponsivelayoutcontainer) 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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean) **returnInheritedElements** true to also return the elements from parent form **Returns:** [Array](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/array) 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](https://docs.servoy.com/reference/servoycore/dev-api/application/uuid) 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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) **name** the specified name of the web component **Returns:** [JSComponent](https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jscomponent) 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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean) **returnInheritedElements** true to also return the elements from parent form **Returns:** [Array](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/array) 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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) **position** the position of responsive layout container object in its parent container **Returns:** [JSResponsiveLayoutContainer](https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jsresponsivelayoutcontainer) 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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) **name** the specified name of the JSWebComponent object * [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) **type** the webcomponent name as it appears in the spec * [Number](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/number) **position** the position of JSWebComponent object in its parent container **Returns:** [JSComponent](https://docs.servoy.com/reference/servoycore/dev-api/solutionmodel/jscomponent) 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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/object) **key** ; * [String](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) **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](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/string) **name** the specified name of the JSWebComponent to be removed **Returns:** [Boolean](https://docs.servoy.com/reference/servoycore/dev-api/js-lib/boolean) true if the JSWebComponent has been removed; false otherwise **Sample** ```js var form = solutionModel.getForm('myform'); form.removeWebComponent('mybean') ``` ***