PDA

View Full Version : getting "Uncaught TypeError: Cannot read property 'events' of undefined "error ..



newusername
15 Nov 2012, 3:47 AM
Hi I am getting this kind of error , and I am not able to resolve it .. Please help me out ..following is the source code ..


<html>

<head>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css">
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all-debug.js"></script>
<script type="text/javascript">

Ext.onReady(function(){
Ext.ns("OMS");


OMS.POHeaderDetailsForm = Ext.extend(Ext.form.FormPanel,{
title : 'PurchaseOrder',
autoScroll : true,
itemid : 'poHeaderDetailsForm',
id : 'poHeaderDetailsForm',
fieldsPrefix : 'SCC$Order$',
termsFieldsPrefix : 'SCC$OrderLine$',
url : "/oms/rest/OMS/enhancedPurchaseOrder/",
defaultState : 'Awaiting Approval',
modelLevelType : "SCC.Order",
sysId : null,
orderType : 'Spot Order',
Notes : {},
initComponent : function(){
//this.layoutConfig = {align: 'stretch'}
//this.plugins = [new OMS.POHeaderDetailsController()];
//this.addEvents("actionclick"); // this event will be fired when button clicked and is handled in controller
//var poLinesGrid = OMS.POGrid.getPOLinesGrid(); // create lines grid
//var poLinesLink = OMS.POHyperLink.getPOLinesHyperLink(); // hyperlink to navigate lines tab

this.items = [{
xtype : 'tabpanel',
id : 'poTabbedPanel',
itemid : 'poTabbedPanel',
activeTab : 0,
autoScroll : true,
items : [this.orderDetailTabItems,
{
xtype : 'panel',
preventheader : true,
autoScroll: true,
layout: 'anchor',
id : 'poLineGridTab',
title : 'Order Lines ('+0+')',
items : []
}
]
}];
OMS.POHeaderDetailsForm.superclass.initComponent.call(this);
}

,orderDetailTabItems : {
labelAlign : 'right',
title : 'Order Details',
layout : 'column',
autoScroll : true,
items : [{
labelAlign : 'right'
,layout : 'form'
,items : [this.leftColumnItems]
},
{
labelAlign : 'right'
,layout : 'form'
,items : [this.leftColumnItems]
}]
}
,leftColumnItems : [
{


name : 'ShipToSite',
xtype : 'autocomplete',
fieldLabel : 'Ship To Site',
allowBlank : false
}
]
});

po= new OMS.POHeaderDetailsForm ();
po.render(document.body);
});



</script>

</head>

<body>

</body>
</html>

willigogs
15 Nov 2012, 4:18 AM
Well one issue might be because under this.items.items you're attempting to add orderDetailTabItems which hasn't been defined yet...

Same issue with orderDetailTabItems.items where you're attempting to add leftColumnItems.

newusername
15 Nov 2012, 5:47 AM
Thanks for ur reply but till I am not getting what should be the solution ...

willigogs
15 Nov 2012, 7:17 AM
You can only add an object after it has been defined.

In your example, you are attempting to add "orderDetailTabItems" but you don't then write the code to create "orderDetailTabItems" until later - therefore this object will be "undefined".

newusername
15 Nov 2012, 8:55 PM
Hey willi .. Will u please provide some example how to do that .. it will be really helpful...Please please

newusername
18 Nov 2012, 10:59 PM
You can only add an object after it has been defined.

In your example, you are attempting to add "orderDetailTabItems" but you don't then write the code to create "orderDetailTabItems" until later - therefore this object will be "undefined".


Willi Please do reply .. I am very much new to JS and ext js ..

willigogs
19 Nov 2012, 2:27 AM
I'm not sure how much simpler I can explain it :(

You can't add an object which doesn't exist yet.

Therefore you must create the leftColumnItems and orderDetailTabItems objects BEFORE calling them inside initComponent.