extjsでコンボをフォーマットするにはどうすればよいですか？

Question

私はext jsにコンボボックスを持っていますが、これには動的に値が入ります。非常に複雑なものはありません。そして年齢：<b></b>タグ内

Name: [dynamicName] 
Gender : [dynamicGender] 
Age: [dynamicAge] 

目的は名前：、性別を持つことです。これは、コンボの表示値の構造です。動的値は通常のテキストでなければなりません。 ここで、コンボのデータストアにデータを格納する配列を定義します。これは配列です：

var arr=[[id1, <b>Name:</b>],[id2, <b>Gender:</b>],[id3, <b>Age:</b>]] 

私がドロップダウンリストをクリックすると、それらが正しく表示されます。ユーザーがオプションを選択するとすぐに、選択されたオプションに「名前...」と言いましょう。フォーマットはすべて間違っています。間違っていると、太字のテキストは表示されません。代わりに、文字列リテラル<b>Name:</b> dynamicNameが表示されます。

これを解決するにはどのようにしてtpl構文を使用できますか？

Answer 1

これはCSSで解決できます。ここでは一つの方法である：

コンボボックスの設定には、追加：

その後

itemCls: 'make-bold' 

（または名前あなたが欲しいものは何でもこのクラスを）、スタイルシートに、追加します（使用して同じ名前の）：

.make-bold input { 
    font-weight: bold; 
} 

これは太字に（コンボボックスから選択した後に表示される内容）あなたの入力ボックスのスタイルを設定します。

Answer 2

オプションリストは<div>要素で構成されており、スタイリングが可能ですが、フィールド自体は<input>要素に過ぎず、コンテンツスタイリングをサポートしていません。

答えは：いいえ、できません。

拡張答え：誰かが別のHTMLマークアップを使用し、フィールド内のスタイル付きコンテンツを許可するコンボボックスコンポーネントの代替実装を行ったと確信しています。 ExtJSフォーラムを尋ねてみてください。

Answer 3

私も同様の問題がありました。私は大胆にコンボリストにいくつかの選択肢を持っているしたいのですが、値が選択されているとき、私は、入力にHTMLマークアップを望んでいない：

1. を参照して、説明this tutorialとしてテンプレートを使用しますテンプレートを使用してコンボボックスの項目の外観を変更する

または選択LISTNERと正規表現 2.Use

。 "select"イベントにリスナーを置き、入力フィールドからHTMLタグを削除するには、一部の正規表現を使用して/< [^>] *>/gのようなHTMLタグを削除するだけです。リストの書式設定に使用されるHTMLは入力に影響しません。