javascript - how to validate data on drop event of itemselecter in extjs? -

we not add 3 word again in selected item. validate on drag , drop event , need show message u added record.
try below code not able fine relevant event validate

listeners: {             added:function(obj,event){                     console.log("added");                },change:function(obj,event){                     console.log("change");                },removed:function(obj,event){                     console.log("removed");                }, blur:function(obj,event){                     console.log("blur");                }, click: function( obj) {                     console.log('click');                 }, select: function( obj) {                      console.log('select');                 }      } 

please see attached image bellow.

i using extjs 3.4

the change event fires when item selected or deselected... @ stage, won't able prevent anymore. so, apparently, best move override onaddbtnclick method:

{     xtype: 'itemselector'      // ... config      ,onaddbtnclick: function() {         var me = this,             selected = me.getselections(me.fromfield.boundlist),             i, l, record;          var tostore = this.tofield.boundlist.getstore(),             idfield = 'value', // or 'id', or whatever want             selectedids = ext.pluck(ext.pluck(tostore.getrange(), 'data'), idfield),             accepted = [], rejected = [];          (i=0, l=selected.length; i<l; i++) {             record = selected[i];             if (selectedids.indexof(record.get(idfield)) === -1) {                 accepted.push(record);             } else {                 rejected.push(record);             }         }          if (rejected.length) {             // warning msg         }          me.moverec(true, accepted);         me.tofield.boundlist.getselectionmodel().select(accepted);     } }