2017-06-08 6 views
0

タグフィールド(別名マルチセレクタコンボボックス)とテキストフィールドの2つのフィールドがあるとしましょう。タグフィールドは、パラメータとして名前と金額を持つ基本ストアから移入されます。 tagfield selectで、対応する金額をテキストフィールドに表示します。タグフィールドから複数のフィールドが選択されている場合は、金額の合計を計算します。extjsの式を使ってコンボボックスの値を集計する

ありにonSelectリスナーtagfield使用していることを実現するためにも問題ありません:

onComboSelect: function(combo, recordArray) { 
    var sum = recordArray.reduce(function(sum, record) { 
     return sum + record.data.amount; 
    }, 0); 
    this.lookup('textfield').setValue(sum) 
} 

は、しかし、私は、私は次のような問題に直面MVVM式に試してみるしたいと思います:あり

  1. をタグフィールドの選択とテキストフィールドの入力の間で選択された値の中の1つの選択肢で '遅延'
  2. 数式を使用して値自体をどのように集計するかについては明白な方法はありません。

fiddle

答えて

1

は本当に奇妙なselectionふるまうへの結合を参照してください。タグフィールドvalueに数式をバインドします。これは、選択されたレコードIDを配列に提供します。次に、ビューモデルで、それらをループし、関連するレコードを取得し、それらの合計を合計します。ビューモデルからストアを参照する方法が必要になります。私はストア宣言をビューモデルに移動することでこれを解決しました。

Tagfieldバインディング:

bind: { 
    value: '{tagValue}', 
    store: '{tagStore}' 
} 

のViewModel設定:ここでは

viewModel: { 
    formulas: { 
     summedAmout: { 
      bind: '{tagValue}', 
      get: function (valueArray) { 
       var sum = 0, 
        tagStore = this.getStore('tagStore'); 

       if (!valueArray.length) { 
        return ''; 
       } 

       valueArray.forEach(function(tagId) { 
        sum += tagStore.getById(tagId).get('cost'); 
       }); 
       return sum; 
      } 
     } 
    }, 
    stores: { 
     tagStore: { 
      data: [{ 
       id: 1, cost: 100, name: 'foo' 
      }, { 
       id: 2, cost: 200, name: 'bar' 
      }] 
     } 
    } 
}, 

はフィドルは次のとおりです。たくさんの、あなたのソリューションは、魔法のように動作https://fiddle.sencha.com/#fiddle/2154&view/editor

+0

ありがとう!それでも私にとっては、ビューモデルの式はちょっと難しいです。たとえデータが設定されていなくても(たとえゲッターがコメントされていても)サイレントスキップすると私は不幸になります。 – fen1ksss

関連する問題