O'Reilly logo

Learning Ext JS 4 by Armando Gonzalez, Crysfel Villa

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Available fields

Ext JS provides many widgets that we can use to collect and edit data in our forms. We are going to learn about the most useful widget and configurations that we can use to create beautiful forms.

For the following examples we are going to create a class that extends from the Form class and hold the fields that we are going to explain in detail later on:

Ext.define('MyApp.view.AvailableFields',{
extend      : 'Ext.form.Panel',
alias       : 'widget.availablefields',

title : 'Available fields',
  width : 280,
  bodyPadding : 5,

  initComponent   : function(){
    var me = this;

    me.items = me.buildItems();

    me.callParent();
  },

  buildItems : function(){
      //We are going to create the fields here		
    return []
  }
});

In the buildItem form we are going to instantiate ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required