Ext JS JavaScript DHTML



Hello World Window






Ext.onReady(function() {
    Ext.QuickTips.init();
    var tabs = [
      {
        xtype     : 'container',
        title     :'Form fields',
        layout    : 'form',
            style     : 'padding:5px 5px 0',
        defaults  : {
          xtype : 'textfield',  
          width : 230
        },
        items   : [
          {
            fieldLabel : 'First Name',
            name       : 'firstName'
          },
          {
            fieldLabel : 'Last Name',
            name       : 'lastName'
          },
          {
            fieldLabel : 'Address1',
            name       : 'address1'
          },
          {
            fieldLabel : 'Address2',
            name       : 'address2'
          }
        ]
      }
    ]    
    var tabPanel = {
      xtype             :'tabpanel',
      activeTab         : 0,
      deferredRender    : false,
      layoutOnTabChange : true,
      border            : false,
      flex              : 1,
      plain             : true,
      items             : tabs
    }
    var fp = new Ext.form.FormPanel({
      renderTo     : Ext.getBody(),
      width        : 700,
      title        : 'Title',
      height       : 500,
      frame        : true,
      style        : 'margin: 20',
      layout       : 'vbox',
      layoutConfig : {
            align : 'stretch'
        },
      defaults     : {
        msgTarget : 'side',
        anchor    : '-20'
      },
      items        : [
        tabPanel
      ]
    });
});
 
asdf