[ExtJS] Form Field

Ext.create("Ext.form.Panel") - 기본 선언만 해도 validation check

 

Field Types

• Ext.form.field.Checkbox

• Ext.form.field.ComboBox

• Ext.form.field.Date

• Ext.form.field.Display

• Ext.form.field.File

• Ext.form.field.Hidden

• Ext.form.field.HtmlEditor

• Ext.form.field.Number

• Ext.form.field.Radio

• Ext.form.field.Text

• Ext.form.field.TextArea

• Ext.form.field.Time

examples.sencha.com/extjs/6.5.1/examples/kitchensink/?classic#form-fields

Sencha | Examples

docs.sencha.com/extjs/6.5.3/guides/components/forms.html

Forms | Ext JS 6.5.3

---

Ext.onReady(function(){
	 Ext.create("Ext.panel.Panel",{
		    width:500,
		    height:350,
		    title:"폼필드",
		    renderTo:Ext.getBody(),
		    items:[{
		      xtype: 'textfield',
		      allowBlank : false,
		      emptyText: '아이디'
		    },{
		      xtype:'textfield',
		      inputType: 'password',
		      emptyText:'패스워드'
		    },{
		      xtype: 'datefield',
		      format : 'y-m-d'
		    },{
		      xtype: 'numberfield',
		      minValue:0,
		      maxValue:10
		    },{
		      xtype: 'timefield'
		    },{
		      xtype: 'filefield',
		      buttonOnly: true
		    },{
		      xtype: 'checkboxfield',
		      boxLabel: '아이디 기억'
		    },{
		      xtype: 'radiofield',
		      name : 'sex',
		      boxLabel : '남'
		    },{
		      xtype: 'radiofield',
		      name : 'sex',
		      boxLabel : '여'
		    },{
		      xtype: 'slider',
		      width:300,
		      value:50
		    }]
	 });
});

결과