您的位置:首页 > Web前端 > JavaScript

Extjs4Form之Number

2013-11-25 10:56 197 查看
Ext.onReady(function(){

	var textFomr = Ext.create("Ext.form.Panel",{
		title : "form中文本框数字框的实例",
		bodyStyle :'padding:5 5 5 5',
		frame : true,
		height : 250,
		width : 400,
		id:'my_form',
		renderTo:'formDemo',
		defaultType:'numberfield',//数字框
		defaults:{
			labelSeparator :": ",
			labelWidth : 80,
			width : 200,
			allowBlank: false,
			msgTarget : 'side',
			labelAlign:'left'
		},
		items:[{
			fieldLabel:'整数微调',
			allowDecimals:false,//叫你不能输入小数
			name:'num1',
			id:'num1'
		},{
			fieldLabel:'整数',
			allowDecimals:false,//叫你不能输入小数
			name:'num2',
			id:'num2',
			hideTrigger : true//隐藏触发按钮,默认是false
		},{
			fieldLabel:'小数',
			name:'num3',
			id:'num3',
			emptyText :'请输入小数',//在没有输入之前显示
			hideTrigger : false,
			decimalPrecision:3//3位小数,默认是两位(四舍五入)
		},{
			fieldLabel:'定界小数',
			name:'num3',
			id:'num3',
			minValue:10,//如果输入不对,会有提示
			maxValue:100,
			emptyText :'请输入小数',
			hideTrigger : false,
			decimalPrecision:3
		},{
			fieldLabel:'输入限定',
			name:'num4',
			id:'num4',
			baseChars:'01',//只能输入0或1
			hideTrigger : true
		},{
			fieldLabel:'限定步长',
			name:'num5',
			id:'num5',
			step:0.8,
			hideTrigger : false,
			value:'20'//默认值
		},{
			fieldLabel:'只读字段',
			name:'num6',
			id:'num6',
			step:0.8,
			hideTrigger : false,
			value:'20',
			//readOnly:true//不能修改
			disabled : true//不启用,也是不能修改
		}],
		buttons: [
		  {text:'登陆系统',handler:function(b){
		  	var formObj = Ext.getCmp("my_form");
		  	var basic = formObj.getForm();
		  		console.log(basic.getValues());
		}}]
	})
})
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: