PDA

View Full Version : Better form validation



StevenInc
11 Apr 2010, 6:24 AM
I have been working with some of the examples in the Ext JS Cookbook when I came across the server side form validation example.

I noticed that if my server is not reachable, nothing happens.

Q) How can I detect this and display an error message.

Thanks.

Here is the code that I am working with.



<style type="text/css">
.app-img
{
vertical-align: middle;
margin: 0px 20px 10px 0px;
}
.app-msg
{
font-size:large; padding: 10px;
}
</style>

<script language="JavaScript" type="text/javascript">
Ext.onReady(function(){
Ext.Msg.alert('EXT JS', Ext.version);
Ext.BLANK_IMAGE_URL = 'images/s.gif';

Ext.QuickTips.init();

var loginForm = {
xtype : 'form',
id : 'login-form',
bodyStyle : 'padding:15px;background:transparent',
border : false,
url : 'login.cfm',
items : [
{ xtype : 'box',
autoEl : {tag: 'div', html:'<div class="app-msg"><img src="images/magic-wand.png" class="app-img" />Log in to the Majic Forum</div>'},
},
{ xtype : 'textfield',
id : 'login-user',
fieldLabel : 'Username',
allowBlank : false,
minLength : 3,
maxLength : 32
},
{ xtype : 'textfield',
id : 'login-pwd',
fieldLabel : 'Password',
inputType : 'password',
allowBlank : false,
minLength : 6,
maxLength : 32,
minLengthText : 'Password must be at least 6 characters in length.'
}
],
buttons :[
{
text : 'Login',
handler : function(){
Ext.getCmp('login-form').getForm().submit({waitMsg: 'Please wait...'})
},
},
{
text : 'Cancel',
handler : function(){win.hide();}
}
],
success : function(f,a){Ext.Msg.alert('[success]', '[msg]');}

};//form

win = new Ext.Window({
layout : 'form',
width : '340',
autoHeight : true,
closeAction : 'hide',
items : [loginForm]
});

win.show();
});//onReady
</script>