ExtJSは、オンザフライでコンボボックスの値を変更する

Question

私はExtJS 3.3で作業しています。私はコンボボックスに値を入力しています。値の一部は展開時にインデントされる必要があります これはコンボが展開されているときにうまく動作しますが、アイテムを選択すると、コンボボックスには実際にそのコンボボックスが表示されます。

たとえば、その拡張したとき、私の値は

 this is my indented value 

として示し、これは私が欲しいものを正確にですが、崩壊したときに

    this is my indented value 

は私が前からスペースをトリミングすることができますどのような方法があるので、値を示し飛行中の値は拡大されたビューでインデントで表示されますが、値が表示され、何も表示されません。

私はselectリスナーを見つけましたが、それはすべて私が見つけることができます。

Answer 1

これは簡単でより論理的なので、私はそれを逆にします。インデントは最初の値の一部であってはなりません。私はコンボのテンプレート変更になります。

tpl: '<tpl for="."><div class="x-combo-list-item"><tpl if="indent">&nbsp;&nbsp;&nbsp;&nbsp;</tpl>{text}</div></tpl>', 

をし、店のアイテムにブール値を追加します。

fields: [{ 
    name:'indent', 
    type:'boolean' 

、trueに設定されている場合、店舗のレコードに対応する値をインデントなります。

異なるインデントが必要な場合は、テンプレート関数を使用して、数値に基づいてインデントを生成できます。次のサンプルのみExtJSに、メーリングリストへの最近のバージョンで動作します。私はそれにも考えていた

tpl: new Ext.XTemplate(
    '<tpl for="."><div class="x-combo-list-item">{[ this.getIndent(values.indent) ]}{text}</div></tpl>', 
    { 
     getIndent: function(indent) { 
      var s = ""; 
      for(var i=0;i<indent; i++) s= s+"&nbsp;"; 
      return s; 
     } 
    } 
), 
store:{ 
    inlineData:[{ 
     text: 'A', 
     indent:2 
    },{ 
     text: 'B', 
     indent: 4 
    }], 
}