syntax error [Archive] - Sencha Forum

pailyanish

12 Jun 2009, 2:43 AM

hai i am new to extjs can anyone help me to sort this error missing } after property list
chrome://firebug/content/blank.gif {\n chrome://firebug/content/blank.gif <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

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

<body>
<script>
Ext.onReady(function(){
var r_form=new Ext.FormPanel({
id:'r_form',
frame:true,
border:true,
bodyStyle:'padding:5px 5px 0',
items:[
{
xtype:'fieldset',
height:368,
title:'User Details',
width:'auto',
html :"<div style='margin-left:60px;'><br>(*) denotes mandatory fields</div>",
items:[
{
xtype:'textfield',
id:'name',
fieldLabel:'Name*',
labelStyle: 'padding-left:13px;',
anchor:'85%'
},
{
xtype:'textarea',
id:'address',
fieldLabel:'Address',
labelStyle: 'padding-left:13px;',
anchor:'85%'
},
{
xtype:'textfield',
id:'p_code',
fieldLabel:'Pin Code',
labelStyle: 'padding-left:13px;',
anchor:'85%'
},
{
xtype:'numberfield',
id:'p_number',
fieldLabel:'Phone Number*',
labelStyle:'padding-left:13px;',
anchor:'85%'
},
{
xtype:'textfield',
id:'email',
fieldLabel:'E-mail*',
labelStyle: 'padding-left:13px;',
vtype:'email',
anchor:'85%'
},
{
xtype:'combo',
id:'area',
fieldLabel:'Area of Work',
labelStyle: 'padding-left:13px;',
store:new Ext.data.SimpleStore({
id:'area_store',
fields:['id','title'],
data:[['1','Conservation'],['2','Biodiversity'],['3','Ecology'],['4','Others']]
}),
displayField:'title',
valueField:'id',
mode:'local',
triggerAction:'all',
emptyText:'Select',
anchor:'85%',
listeners:{
'select':function(){
if(this.getValue() == 4){
Ext.getCmp('other').show();
}
else{
Ext.getCmp('other').hide();
}
}
}
},
{
xtype:'textfield',
id:'other',
hidden:true,
hideLabel:true,
labelStyle: 'padding-left:13px;',
style:'margin-left:115px',
anchor:'55%',
emptyText:'Please Specify others'
},
{
xtype:'combo',
id:'desig',
fieldLabel:'Designation',
labelStyle: 'padding-left:13px;',
store:new Ext.data.SimpleStore({
id:'desig_store',
fields:['id','title'],
data:[['1','Professor'],['2','Student'],['3','Scholar']]
}),
displayField:'title',
valueField:'id',
mode:'local',
triggerAction:'all',
emptyText:'Select',
anchor:'85%'
},
{
xtype:'textarea',
height:50,
id:'purpose',
fieldLabel:'Purpose',
labelStyle: 'padding-left:13px;',
anchor:'85%'
}

]

},
{
xtype:'fieldset',
title:'Terms and Conditions',
width:'auto',
height:'auto',
html :"<div style='margin-left:0px;'><br>I declare that I will not use it for a commercial or publication purpose<br></div>",
buttonAlign:'center',
items:[
{
xtype:'textarea',
width:340,
hideLabel:true,
}
],
buttons:[
{
text:'Submit',
type:'submit',
handler:validation()
{
if(r_form.getForm().isValid())
{
r_form.getForm().submit({
action:'index.html'

});
}
}
}
]

function validation()
{
if(Ext.getCmp('name').getValue="")
{
Ext.MessageBox.alert("Error","Please enter a name");
}

if(Ext.getCmp('p_number').getValue="")
{
Ext.MessageBox.alert("Error","Please enter a phonenumber");
}
if(Ext.getCmp('email').getValue="")
{
Ext.MessageBox.alert("Error","Please enter an email");
}

}

},

]
});
Ext.apply(Ext.form.VTypes, {
'email': function()
{
var re = /^[a-zA-Z][\w\.-]*[a-zA-Z0-9]@[a-zA-Z0-9][\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]$/;
return function(v){
return re.test(v);
}
}(),
'emailText' : 'Invalid Email'
});

new Ext.Window({
title:'Registratrion Form',
width:400,
height:600,
modal:true,
constrainHeader :true,
layout:'fit',
items:[r_form]
}).show();

});
</script>
</body>
</html>
thanks in advance

nikhilkrishnan

12 Jun 2009, 3:19 AM

You have defined the function validation inside fieldset config options

nikhilkrishnan

12 Jun 2009, 3:48 AM

Check this,

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

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

<body>
<script>
Ext.onReady(function(){
var r_form=new Ext.FormPanel({
id:'r_form',
frame:true,
border:true,
bodyStyle:'padding:5px 5px 0',
items:[{
xtype:'fieldset',
height:368,
title:'User Details',
width:'auto',
html :"<div style='margin-left:60px;'><br>(*) denotes mandatory fields</div>",
items:[{
xtype:'textfield',
id:'name',
fieldLabel:'Name*',
labelStyle: 'padding-left:13px;',
anchor:'85%'
},
{
xtype:'textarea',
id:'address',
fieldLabel:'Address',
labelStyle: 'padding-left:13px;',
anchor:'85%'
},
{
xtype:'textfield',
id:'p_code',
fieldLabel:'Pin Code',
labelStyle: 'padding-left:13px;',
anchor:'85%'
},
{
xtype:'numberfield',
id:'p_number',
fieldLabel:'Phone Number*',
labelStyle:'padding-left:13px;',
anchor:'85%'
},
{
xtype:'textfield',
id:'email',
fieldLabel:'E-mail*',
labelStyle: 'padding-left:13px;',
vtype:'email',
anchor:'85%'
},
{
xtype:'combo',
id:'area',
fieldLabel:'Area of Work',
labelStyle: 'padding-left:13px;',
store:new Ext.data.SimpleStore({
id:'area_store',
fields:['id','title'],
data:[['1','Conservation'],['2','Biodiversity'],['3','Ecology'],['4','Others']]
}),
displayField:'title',
valueField:'id',
mode:'local',
triggerAction:'all',
emptyText:'Select',
anchor:'85%',
listeners:{
'select':function(){
if(this.getValue() == 4){
Ext.getCmp('other').show();
}
else{
Ext.getCmp('other').hide();
}
}
}
},
{
xtype:'textfield',
id:'other',
hidden:true,
hideLabel:true,
labelStyle: 'padding-left:13px;',
style:'margin-left:115px',
anchor:'55%',
emptyText:'Please Specify others'
},
{
xtype:'combo',
id:'desig',
fieldLabel:'Designation',
labelStyle: 'padding-left:13px;',
store:new Ext.data.SimpleStore({
id:'desig_store',
fields:['id','title'],
data:[['1','Professor'],['2','Student'],['3','Scholar']]
}),
displayField:'title',
valueField:'id',
mode:'local',
triggerAction:'all',
emptyText:'Select',
anchor:'85%'
},
{
xtype:'textarea',
height:50,
id:'purpose',
fieldLabel:'Purpose',
labelStyle: 'padding-left:13px;',
anchor:'85%'
}]
},{
xtype:'fieldset',
title:'Terms and Conditions',
width:'auto',
height:'auto',
html :"<div style='margin-left:0px;'><br>I declare that I will not use it for a commercial or publication purpose<br></div>",
buttonAlign:'center',
buttons:[
{
text:'Submit',
type:'submit',
handler:validation
}
]
}
]

});
Ext.apply(Ext.form.VTypes, {
'email': function()
{
var re = /^[a-zA-Z][\w\.-]*[a-zA-Z0-9]@[a-zA-Z0-9][\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]$/;
return function(v){
return re.test(v);
}
}(),
'emailText' : 'Invalid Email'
});

function validation()
{
if(Ext.getCmp('name').getValue="")
{
Ext.MessageBox.alert("Error","Please enter a name");
}

if(Ext.getCmp('p_number').getValue="")
{
Ext.MessageBox.alert("Error","Please enter a phonenumber");
}
if(Ext.getCmp('email').getValue="")
{
Ext.MessageBox.alert("Error","Please enter an email");
}

}

new Ext.Window({
title:'Registratrion Form',
width:400,
height:600,
modal:true,
constrainHeader :true,
layout:'fit',
items:[r_form]
}).show();

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