Mega Code Archive

 
Categories / JavaScript DHTML / Ext JS
 

Layout fieldset Container as hbox

<html> <head> <title>Hello World Window</title> <link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" /> <script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="ext-3.0.0/ext-all.js"></script> </head> <body> <script type="text/javascript"> Ext.onReady(function() {     Ext.QuickTips.init();     var fieldset1 = {       xtype       : 'fieldset',       title       : 'Name',       flex        : 1,       border      : false,       labelWidth  : 50,       defaultType : 'field',       defaults    : {         anchor     : '-10',         allowBlank : false       },       items : [         {           fieldLabel : 'First',           name       : 'firstName'         },         {           fieldLabel : 'Middle',           name       : 'middle'         }       ]     }          var fieldset2 = Ext.apply({}, {       flex       : 1,       labelWidth : 50,       title      : 'Address',       items      : [         {           fieldLabel : 'Address',           name       : 'address'         },         {           fieldLabel : 'City',           name       : 'city'         }       ]          }, fieldset1);                    var fieldsetContainer = {       xtype  : 'container',       layout  : 'hbox',       height  : 120,       layoutConfig : {         align : 'stretch',       },       items  : [         fieldset1,         fieldset2       ]     }          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        : [         fieldsetContainer       ]     }); }); </script>  <div id='div1'>asdf</div> </body> </html>