javascript - extjsのitemselecterのドロップイベントでデータを検証する方法は?

Question

選択した項目に再び 3 つの単語を追加するのは好きではありません。ドラッグ アンド ドロップ イベントで検証したいので、このレコードが既に追加されているというメッセージを表示する必要があります。
以下のコードを試してみましたが、検証に関連するイベントをうまく処理できませんでした

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');   
             }  
   }

以下の添付画像をご覧ください。

私はExtjs 3.4を使用しています

Answer 1

アイテムが選択または選択解除されると、changeイベントが発生します... しかし、この段階では、それを防ぐことはできなくなります。したがって、どうやら、最善の方法はonAddBtnClickメソッドをオーバーライドすることです。

{
    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 you want
            selectedIds = Ext.pluck(Ext.pluck(toStore.getRange(), 'data'), idField),
            accepted = [], rejected = [];

        for (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);
    }
}