Make empty filled space

I have this menu:

items:[ { xtype: 'form', id: 'searchPanel', title: 'Search', collapsible: true, bodyPadding: 10, height: 210, buttonAlign: 'left', defaults: { width: 400, labelWidth: 120, allowBlank: true, enableKeyEvents: true }, layout: { type: 'table', columns: 2 }, items: [ { xtype: 'textfield', name: 'txtFltrSiteName', fieldLabel: 'Site name or alias', id: 'txtFltrSiteName' }, { xtype: 'textfield', name: 'txtDiskCost', fieldLabel: 'Disk cost', id: 'txtDiskCost', style: 'margin-left: 100px;' }, { xtype: 'textfield', name: 'txtFltrProjectName', fieldLabel: 'Project name', id: 'txtFltrProjectName' }, // many other fields 

Both chackboxes and text fields have diffirent widths, so it looks ugly.
So, the quest:
How to make empty <td> in this form?
For reference, I want 6-2 items:

  ----------
 |  1 |  1 |
 |  2 |  2 |
 |  3 |  |
 |  4 |  |
 | ..etc ... |
 ----------
+4
source share
2 answers

Just make a hidden entry. eg:

 { xtype: 'hidden', name: 'hidden1', id: 'hidden1' }, 

This will make the <td> column, but it will be empty, because it will be hidden in it.

+4
source

It's better here:

 { xtype : 'label', text : '', labelSeparator: '' } 
0
source

All Articles