---
title: "What is Container and how to use it in ExtJs?"  
description: "What is Container and how to use it in ExtJs?"  
author: "Abhishek Srivasatava"  
published: 2016-11-14  
updated: 2020-09-23  
canonical: https://www.mindstick.com/interview/23106/what-is-container-and-how-to-use-it-in-extjs  
category: "sencha extjs"  
tags: ["javascript", "sencha"]  
reading_time: 3 minutes  

---

# What is Container and how to use it in ExtJs?

Containers in ExtJs is the term which is used to describe the grouping of the different component.

**Example:** there are four components A, B, C, and D and we need to show two elements in one block and rest to in different blocks.

That block is called a container.

A Container may contain other containers also.

\

An example to show how to use component inside the Container.

```
 <!DOCTYPE html><html><head>   <link href="https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/classic/theme-classic/resources/theme-classic-all.css" rel="stylesheet" />   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/ext-all.js"></script>   <script type="text/javascript">       Ext.onReady(function () {           var childPanel1 = Ext.create('Ext.Panel', {               title: 'panel1',                             width: 70,               height: 70,               html: 'First Panel'           });            var childPanel2 = Ext.create('Ext.Panel', {               title : 'panel2',                           width: 70,               height: 70,               html: 'second Panel'           });            var childPanel3 = Ext.create('Ext.Panel', {               title: 'panel3',                width: 70,               height: 70,               html: '3rd Panel'           });            var childPanel4 = Ext.create('Ext.Panel', {               title: 'panel4',                width: 70,               height: 70,               html: '4th Panel'           });           var container1= Ext.create('Ext.container.Container', {              // renderTo: Ext.getBody(),               width: 160,               height: 100,               border: true,               frame: true,               layout : 'accordion',               items: [childPanel1,childPanel2]           });            Ext.create('Ext.container.Container', {               renderTo: Ext.getBody(),               width: 160,               height: 100,               border: true,               frame: true,               items: [container1,childPanel3, childPanel4]           });         });   </script></head><body></body></html> 
```

In the above example, we have used multiple functionalities of the container. We have created 4 panels and 2 containers. 1st container will contain 2 panels and 2nd container will contain 2 panels and 1child container.

If we execute above program, we will get following result:

\

![What is Container and how to use it in ExtJs?](data:image/png;base64,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)\

## Answers

### Answer by Abhishek Srivasatava

Containers in ExtJs is the term which is used to describe the grouping of the different component.

**Example:** there are four components A, B, C, and D and we need to show two elements in one block and rest to in different blocks.

That block is called a container.

A Container may contain other containers also.

\

An example to show how to use component inside the Container.

```
 <!DOCTYPE html><html><head>   <link href="https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/classic/theme-classic/resources/theme-classic-all.css" rel="stylesheet" />   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/ext-all.js"></script>   <script type="text/javascript">       Ext.onReady(function () {           var childPanel1 = Ext.create('Ext.Panel', {               title: 'panel1',                             width: 70,               height: 70,               html: 'First Panel'           });            var childPanel2 = Ext.create('Ext.Panel', {               title : 'panel2',                           width: 70,               height: 70,               html: 'second Panel'           });            var childPanel3 = Ext.create('Ext.Panel', {               title: 'panel3',                width: 70,               height: 70,               html: '3rd Panel'           });            var childPanel4 = Ext.create('Ext.Panel', {               title: 'panel4',                width: 70,               height: 70,               html: '4th Panel'           });           var container1= Ext.create('Ext.container.Container', {              // renderTo: Ext.getBody(),               width: 160,               height: 100,               border: true,               frame: true,               layout : 'accordion',               items: [childPanel1,childPanel2]           });            Ext.create('Ext.container.Container', {               renderTo: Ext.getBody(),               width: 160,               height: 100,               border: true,               frame: true,               items: [container1,childPanel3, childPanel4]           });         });   </script></head><body></body></html> 
```

In the above example, we have used multiple functionalities of the container. We have created 4 panels and 2 containers. 1st container will contain 2 panels and 2nd container will contain 2 panels and 1child container.

If we execute above program, we will get following result:

\

![What is Container and how to use it in ExtJs?](data:image/png;base64,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)\


---

Original Source: https://www.mindstick.com/interview/23106/what-is-container-and-how-to-use-it-in-extjs

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
