In the extjs library, you can write it manually. It is difficult to debug JavaScript code in a non-visualized manner. Work efficiency is relatively low. Therefore, the ext designer preview visual editor is used for operations. It is visualized. However, after personal operations, it may be better to manually modify the set.
Eg: Use ext designer preview to generate the followingCode:
Ext. mywindow = ext. Extend (ext. Window ,{
Xtype: "window ",
Title: "My windows ",
Width: 542,
Height: 358,
Initcomponent: function (){
This. Items = [
{
Xtype: "container ",
Autoel: "Div ",
Items :[
{
Xtype: "form ",
Title: "User Registration ",
Labelwidth: 100,
Labelalign: "right ",
Layout: "form ",
Width: 500,
Items :[
{
Xtype: "textfield ",
Fieldlabel: "User Name ",
Anchor: "60% ",
Width: 200
},
{
Xtype: "textfield ",
Fieldlabel: "Age ",
Anchor: "60%"
},
{
Xtype: "textfield ",
Fieldlabel: "Home Address ",
Anchor: "60%"
}
]
}
]
}
]
Ext. mywindow. superclass. initcomponent. Call (this );
}
})
In fact, we can manually inherit Ext. mywindow = ext. Extend (ext. Window to create a form and change it to new Ext. Windows. Reduce the workload