Define your own validation type

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

</head>
<body>
<script type="text/javascript">
Ext.onReady(function() {
    
Ext.QuickTips.init();

var formPanelItems =[
   {
      fieldLabel : 'URL',
      allowBlank : false,
      vtype      : 'urlOnly',
    msgTarget  : 'title'
    
   }
];

var myValidFn = function(v) {
   var myRegex = /https?:\/\/([-\w\.]+)+(:\d+)?(\/([\w/_\.]*(\?\S+)?)?)?/;
   return myRegex.test(v);
}

Ext.apply(Ext.form.VTypes, {
    urlOnly     : myValidFn,
    urlOnlyText : 'Must a valid web url'
});

var fp = new Ext.form.FormPanel({
   renderTo     : Ext.getBody(),
   width        : 400,
   title        : 'Title here',
   height       : 170,
   frame        : true,
   bodyStyle    : 'padding: 5px',
   monitorValid : true,
   monitorPoll  : 50, 
   labelWidth   : 125,   
   defaultType  : 'textfield',
   defaults     : {
      msgTarget : 'side',
      anchor    : '-20'
   },
   items        : formPanelItems,
});



});
</script> 
<div id='div1'>asdf</div>
</body>
</html>

Related examples in the same category

1.	Mark a form field as required
2.	Set mask regular expression
3.	Customize your own message for validation
4.	Use separate function as the validation function
5.	Set strip character regular expression
6.	Set alert message for empty input
7.	Create customized validation function for field
8.	Define validation type
9.	Advanced Validation Examples Using VTypes

Define your own validation type : Form Validation « Ext JS « JavaScript DHTML

Related examples in the same category