Sharing functionality with the Action class

Components such as buttons, menus, and toolbars frequently perform similar functionalities. This recipe shows you how you can use the Action interface to abstract a hypothetical Import function out of a menu, a toolbar item, and a button's handlers, effectively implementing a variant of the command design pattern. You will also learn how to use Action to change different configuration options of the components that use it.

In the following screenshot; a toolbar item, a menu item, and a button are all wired to perform the Import functionality by using the Ext.Action interface:

Clicking on any of the components that use the Action interface will execute the Import functionality, as seen in the following screenshot:

The Action interface allows you to change the text of the components that use it. In this recipe, you'll use an Ext.Msg.prompt to change the Action's text, as seen in the following screenshot:

After entering the new text, all of the components...