JavaScript DHTML/Ext JS/Number Field
Create number field
<source lang="html4strict">
<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 =[
{
xtype : "numberfield",
fieldLabel : "Numbers only",
allowBlank : false,
emptyText : "This field is empty!",
decimalPrecision : 3,
minValue : 0.001,
maxValue : 2
}
];
var fp = new Ext.form.FormPanel({
renderTo : Ext.getBody(),
width : 400,
title : "Number field",
height : 170,
frame : true,
bodyStyle : "padding: 5px",
monitorValid : true,
monitorPoll : 50,
labelWidth : 125,
defaults : {
msgTarget : "side",
anchor : "-20"
},
items : formPanelItems
});
}); </script>
</body> </html>
</source>
Set decimal Precision for number field
<source lang="html4strict">
<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 =[
{
xtype : "numberfield",
fieldLabel : "Numbers only",
allowBlank : false,
emptyText : "This field is empty!",
decimalPrecision : 3,
minValue : 0.001,
maxValue : 2
}
];
var fp = new Ext.form.FormPanel({
renderTo : Ext.getBody(),
width : 400,
title : "Number field",
height : 170,
frame : true,
bodyStyle : "padding: 5px",
monitorValid : true,
monitorPoll : 50,
labelWidth : 125,
defaults : {
msgTarget : "side",
anchor : "-20"
},
items : formPanelItems
});
}); </script>
</body> </html>
</source>
