가장 기본 component 인 Panel

Form에도 추가 가능 , Tab이 item으로도 사용가능

AutoLoad기능을 사용해 init될때 자동 수행

ex)
///////////////////////////////////////////////////////////////
// tab_item1을 object 외부의 property로 사용하겠다고 선언하다는 의미
this.tab_item1 = new Ext.Panel({
        width:200,
        height:250,
        plain:true,
        title: '매크로',
        autoLoad: {
            url: "function.htm",
            params: { template: "sms", action: "get_macro" }
        }      
});

//////////////////////////////////////////////////////////////////////
//  해당 tab_item1 의 내용을 새로 로딩 할 경우
//  load method를 사용해 준다.
obj_sms.tab_item1.load({
            url: "function.htm",
            params: { template: "sms", action: "get_macro" },
            text: "Loading",
            success: function() {
                alert ( "완료" );
            }
        });

ext panel 샘플

// This code will generate a layout table that is 3 columns by 2 rows
// with some spanning included.  The basic layout will be:
// +--------+-----------------+
// |   A    |   B             |
// |        |--------+--------|
// |        |   C    |   D    |
// +--------+--------+--------+
var table = new Ext.Panel({
    title: 'Table Layout',
    layout:'table',
    defaults: {
        // applied to each contained panel
        bodyStyle:'padding:20px'
    },
    layoutConfig: {
        // The total column count must be specified here
        columns: 3
    },
    items: [{
        html: '<p>Cell A content</p>',
        rowspan: 2
    },{
        html: '<p>Cell B content</p>',
        colspan: 2
    },{
        html: '<p>Cell C content</p>'
    },{
        html: '<p>Cell D content</p>'
    }]
});