PDA

View Full Version : Using Ext.define in 4



roshniblr
17 Aug 2011, 8:06 PM
Hi,

Recently I have moved to Extjs 4. I was using Ext.extend in 3.X.
Currently I have re written my like this:

Ext.onReady(function(){
Ext.define(Ext.my.Calendar, {
extend: 'Ext.form.field.Date',
alias: 'widget.datefield'

});

var datefield_Calendar=Ext.create('Ext.my.Calendar', {
renderTo:'calendarDate',
allowBlank:false,
startWithCurrentDate:false,
name:'date',
value:'',
format:'m/d/Y',
preventMark:true,
id: 'datefield'
});

});

But this is not working.

raz0r1
17 Aug 2011, 10:23 PM
Hi,
for my it's working with nearly exactly your code.
- you have to put the name of your self defined class in '



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/ext-all-debug.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.define('Ext.my.Calendar', {
extend: 'Ext.form.field.Date',
alias: 'widget.datefield'


});


var datefield_Calendar=Ext.create('Ext.my.Calendar', {
renderTo:'calendarDate',
allowBlank:false,
startWithCurrentDate:false,
name:'date',
value:'',
format:'m/d/Y',
preventMark:true,
id: 'datefield'
});


});</script>
</head>
<body></body>
</html>


If you use ext-debug.js instead of ext-all-debug.js you haft to add "Ext.require('Ext.form.field.Date);" before you use it.

I would also add


initComponent: function() {
this.callParent(arguments);
}

to your definition of Ext.my.Calender.

I hope that helps.

skirtle
18 Aug 2011, 4:18 PM
@roshniblr, please use code tags when posting code (# button on the editor toolbar).

raz0r1 is correct that Ext.define() takes a string as its first argument. However, I don't understand the comment about initComponent. If all you do is callParent() then it's effectively not doing anything. Only add it if you need it.

raz0r1
18 Aug 2011, 9:53 PM
@roshniblr, please use code tags when posting code (# button on the editor toolbar).

raz0r1 is correct that Ext.define() takes a string as its first argument. However, I don't understand the comment about initComponent. If all you do is callParent() then it's effectively not doing anything. Only add it if you need it.

yes you are right but sometimes a had issues when not adding callParent(). So now I add it always only to be sure ;)