Most websites and applications make use of windows and forms on a regular basis. Here you'll learn the basics for creating a simple form and window with Ext JS and combining the two to display the form to the user.
Start by creating a simple form with two fields and a button.
var form = Ext.create('Ext.form.Panel', { bodyPadding: 10, border: false, defaultType: 'textfield', items: [{ fieldLabel: 'Username', name: 'username', allowBlank: false }, { fieldLabel: 'Password', name: 'password', inputType: 'password', allowBlank: false }], buttons: [{ text: 'Login', formBind: true, disabled: true, handler: function(){ alert('Login Button Pressed'); } }] });
Create an
Ext.window.Window
with the form in itsitems
collection and display it to the user using theshow
method:Ext.create('Ext.window.Window', { title...