Feb 06, 2009, 6:47 AM
Body null error
I have a complex form inside a window and I need to add fields to the form at run time on the click of a button. For example I have 5 address fields and I have a button 'Add Another Address' which should insert another 5 address fields into the form. I have a function which creates the required fields and adds them to the form fieldset. I am getting the error :
this.body is null
this.body.addClass(this.bodyCls + '-noheader');
The function that adds the Address Fields and the Form are as follows : addAddressFields: function() {
var addressFields = new Ext.Panel({
title: 'Additional Address',
bodyBorder: false,
bodyStyle: 'background: none; padding : 8px 0',
items: new Ext.FormPanel({
layout: 'column',
items: [
{
columnWidth: 0.5,
defaultType: 'textfield',
items: [
{
fieldLabel: 'Address Line 1',
width: 130,
labelStyle: 'padding-left:8px;font-weight:bold'
},
{
fieldLabel: 'Address Line 2',
width: 130,
labelStyle: 'padding-left:8px;font-weight:bold'
}, {
fieldLabel: 'Town',
width: 130,
labelStyle: 'padding-left:8px;font-weight:bold'
}, {
fieldLabel: 'Postcode',
width: 130,
labelStyle: 'padding-left:8px;font-weight:bold'
}
]
}, {
columnWidth: 0.5,
defaultType: 'textfield',
items: [
{
fieldLabel: 'Address Line 3',
width: 130,
labelStyle: 'padding-left:8px;font-weight:bold'
},
{
fieldLabel: 'Address Line 4',
width: 130,
labelStyle: 'padding-left:8px;font-weight:bold'
}, {
fieldLabel: 'County',
width: 130,
labelStyle: 'padding-left:8px;font-weight:bold'
}, {
fieldLabel: 'Country',
width: 130,
labelStyle: 'padding-left:8px;font-weight:bold'
}
]
}
]
})
});
OrgEntityAddressFieldSet.add(addressFields);
OrgEntityAddressFieldSet.doLayout();
},
The Window/Form <ext:Window
ID="EditOrgEntityWindow"
runat="server"
showonload="false"
Collapsible="true"
Resizable="true"
Icon="ApplicationDouble"
Title="Add New Organisational Entity"
Width="630"
Height="450" AutoScroll="true"
Constrain="true"
Modal="true" BodyBorder="true"
BodyStyle="padding : 10px;" Minimizable="True">
<Body>
<ext:TextField ID="OrgEntityFormMode" Text="" Hidden="true" runat="server" />
<ext:TextField ID="OrgEntityType" Text="" Hidden="true" runat="server" />
<ext:FormLayout ID="OrgEntityFormLayout" Cls="formlayout" Width="500" runat="server">
<ext:Anchor>
<ext:TextField
ID="OrgEntityName"
FieldLabel="Name"
InputType="Text"
LabelStyle="padding-left:8px;font-weight:bold"
AllowBlank="false"
Width="200"
BlankText="Name is required"
runat="server" />
</ext:Anchor>
<ext:Anchor>
<ext:FieldSet ID="OrgEntityAddressFieldSet" Collapsible="true" runat="server" AutoHeight="true" Title="Address">
<Body>
<ext:Panel ID="ContainerPanelAddress1" runat="server" Title="Address 1" BodyBorder="false" BodyStyle="background:none;padding: 10px 0;">
<Body>
<ext:ColumnLayout ID="OrgEntityAddressLayout" runat="server">
<ext:LayoutColumn ColumnWidth="0.5">
<ext:Panel ID="OrgEntityAddressPanelLeft" runat="server" BodyBorder="false" BodyStyle="background:none;">
<Body>
<ext:FormLayout ID="OrgEntityFormLayoutLeft" runat="server">
<ext:Anchor>
<ext:TextField
ID="OrgEntityA1"
FieldLabel="Address Line 1"
LabelStyle="padding-left:8px;font-weight:bold"
InputType="Text"
Width="130"
runat="server" />
</ext:Anchor>
<ext:Anchor>
<ext:TextField
ID="OrgEntityA3"
FieldLabel="Address Line 3"
LabelStyle="padding-left:8px;font-weight:bold"
InputType="Text"
Width="130"
runat="server" />
</ext:Anchor>
<ext:Anchor>
<ext:TextField
ID="OrgEntityTown"
FieldLabel="Town/City"
LabelStyle="padding-left:8px;font-weight:bold"
InputType="Text"
Width="130"
runat="server" />
</ext:Anchor>
<ext:Anchor>
<ext:TextField
ID="OrgEntityPostCode"
FieldLabel="Post Code"
LabelStyle="padding-left:8px;font-weight:bold"
InputType="Text"
Width="100"
runat="server" />
</ext:Anchor>
</ext:FormLayout>
</Body>
</ext:Panel>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth="0.5">
<ext:Panel ID="OrgEntityAddressPanelRight" runat="server" BodyBorder="false" BodyStyle="background:none;">
<Body>
<ext:FormLayout ID="OrgEntityFormLayoutRight" runat="server">
<ext:Anchor>
<ext:TextField
ID="OrgEntityA2"
FieldLabel="Address Line 2"
LabelStyle="padding-left:8px;font-weight:bold"
InputType="Text"
Width="130"
runat="server" />
</ext:Anchor>
<ext:Anchor>
<ext:TextField
ID="OrgEntityA4"
FieldLabel="Address Line 4"
LabelStyle="padding-left:8px;font-weight:bold"
InputType="Text"
Width="130"
runat="server" />
</ext:Anchor>
<ext:Anchor>
<ext:TextField
ID="OrgEntityCounty"
FieldLabel="County/State"
LabelStyle="padding-left:8px;font-weight:bold"
InputType="Text"
Width="130"
runat="server" />
</ext:Anchor>
<ext:Anchor>
<ext:ComboBox ID="OrgEntityCountryList" FieldLabel="Country" LabelStyle="padding-left:8px;font-weight:bold" runat="server">
<SelectedItem Value="United Kingdom" />
<Items>
<ext:ListItem Text="United Kingdom" Value="United Kingdom" />
</Items>
</ext:ComboBox>
</ext:Anchor>
</ext:FormLayout>
</Body>
</ext:Panel>
</ext:LayoutColumn>
</ext:ColumnLayout>
</Body>
</ext:Panel>
</Body>
<Buttons>
<ext:Button ID="AddAddressBtn" runat="server" Text="Add Another Address" OnClientClick="OrgEntityHandler.addAddressFields();"></ext:Button>
</Buttons>
</ext:FieldSet>
</ext:Anchor>
/*********** REST OF THE FORM OMITTED *******/