The form component

Ext JS contains a component called Ext.form.Panel. This component is a subclass of Ext.panel.Panel and uses Ext.form.Basic as a required class. This class is fundamental for handling the form's submission.

When designing applications, it's important to mention that a previous analysis may be clear for us, so we create blocks (code, forms, components, and so on) that can be reused in other modules. The following screenshot represents a part of our application. We can see that the form component will need to have certain functionalities, such as create, edit, delete, and so on.

As you can see, the form prototype on the right side contains a title, one toolbar at the top, one toolbar at the bottom, and then six fields. Now we can begin creating the form as a separate component. As in our previous code samples, we extend our new class from the Ext.form.Panel class:

Ext.define('MyApp.view.CustomerForm01', {
  extend: 'Ext.form.Panel',
  alias: 'widget.customerform01',
  height...