Adding Buttons in a Dataview using ExtJS 4.2

If you have a dataview in your ExtJS application, it might be possible that you want to add some action buttons for each of its items. With some good old Javascript this is actually quite easy.
You just have to create a template that contains the HTML markup for the button and give it a distinguishable class name. In the itemmousedown listener of the dataview you later check for the class name.
Here’s a small example that uses this approach:

Add a delete button in each row of an ExtJS data grid

For usability reasons it is usually a good idea to add a delete button to each row of a data grid. If the user clicks on such a button, the whole row that contained the button will be deleted.

The data grid of ExtJS does not contain such a feature by default, but it could be implemented by adding a special column to the column model. Using this extension, it could be easily done like this:

Note that the itemDeleter instance must be added to the ColumnModel and set as selModel to work properly.