in extjs how to develop forms ??

Question

Hi I am trying to develop a simple form in extjs, but the problem is I am unable to set the coordinates of my fields

actually, here in extjs when I develop a form say two

var uplift_box = new Ext.form.NumberField({
    name:'uplift_box' ,
    value:0 , 
    allowblank:false , 
    enableKeyEvents:true ,
    fieldLabel:'UPLIFT BOX' });

var uplift_box2 = new Ext.form.NumberField({
    name:'uplift_box2' ,
    value:0 , 
    allowblank:false , 
    enableKeyEvents:true ,
    fieldLabel:'UPLIFT2 BOX' }); 

var myform = new Ext.FormPanel({ 
    //url: 'your.php',
          //renderTo: Ext.getBody(),
    collapsible:true,
    frame:true,
    bodyStyle:'',
    title: 'Form Standard',
    layout: {
    type: 'form',
    msgTarget: 'side'
    },
    region:'north',
    //width: 250,
    height:150,
    items: [ uplift_box , uplift_box2 ]
});

these fields always displayed one below the other, how can I show them side by side with label shown

Answer 1

I would recommend to have a look at the source code of the extJs examples:

ExtJs dynamic form examples

If you want the form fields to be next to each other you can do this by using the ColumnLayout for the parent form panel of the form fields. Have a look at the source code of the third example of the given link and it should get pretty clear.

To show the label, set the text into the property "fieldLabel", to align the label to the left or on top of the form field use "labelAlign" in the formPanel.