O'Reilly logo

Learning Ext JS - Fourth Edition by Armando Gonzalez, Crysfel Villa, Carlos A. Méndez

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

Handling events in DataView

Once we have our DataView defined, we are going to see some basic event handling for it. To do this, we need to add some new properties to our view definition so that we can assign events:

  var myDataview = Ext.create('Ext.view.View', {
    store: myStore,
    tpl: myTpl,
    padding: 6,
    itemSelector: 'div.user', //Step 1
    emptyText: '<b>No users available</b>'
  });

We added the itemSelector property (Step 1). It defines which DOM node item will be used to select each item (data model) with which the DataView will be working.

You can use CSS selectors to define the itemSelector property.

And now, let's add the event listener:

var myDataview = Ext.create('Ext.view.View', { store: myStore, tpl: myTpl, padding: 6, itemSelector: 'div.user', ...

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