2

アコーディオンに子パネルを挿入/追加する必要があります。これらの各子パネルには、データの「フィールド」値を使用してタイトルを付ける必要があり (以下を参照)、各子パネルのコンテンツは、クリック可能である限り (ラベルまたは表示フィールドまたは ??) にする必要があります。サーバーからのjsonデータは次のとおりです。

data: [{
    'field': 'cities',
    'values': [{
        'value': 'DC',
        'count': 5
    }, {
        'value': 'SF',
        'count': 2
    }, {
        'value': 'NYC',
        'count': 4
    }, {
        'value': 'Nashville',
        'count': 4
    }]
}, {
    'field': 'beaches',
    'values': [{
        'value': 'obx',
        'count': 1
    }, {
        'value': 'ocean city',
        'count': 2
    }, {
        'value': 'myrtle',
        'count': 4
    }]
}, {
    'field': 'planets',
    'values': [{
        'value': 'mercury',
        'count': 1
    }, {
        'value': 'venus',
        'count': 2
    }, {
        'value': 'earth',
        'count': 4
    }, {
        'value': 'mars',
        'count': 1
    }, {
        'value': 'jupiter',
        'count': 2
    }, {
        'value': 'uranus',
        'count': 4
    }, {
        'value': 'neptune',
        'count': 1
    }]
}]

レンダリングが機能します!! :)

しかし、機能するクリック イベントを取得する方法はありません。最終的に、クリック リスナーは、選択した値 + 'フィールド' 値へのアクセスを許可する必要があります。(たとえば、「惑星」、「木星」)。

これは簡単なはずですが、うまくいきません。最初は for ループをネストしてその場でコンポーネントを作成しようとしましたが、動作するクリック ハンドラーを追加できませんでした (おそらく b/c ストア ロード ハンドラー関数内で作業を行っているのでしょうか?)。パネル内でデータビューも試しました (配列だけを渡します) が、itemSelector がトリガーされません。コードに基づいて「div.facet」、「div.facet_item」(およびその他のいくつかなど) を試しましたが、うまくいきませんでした。私のコントローラの this.control():

'panel[itemId=pnlFacets] > panel > dataview': {
    itemclick: me.facetSelect
}

およびデータビュー試行の tpl:

var tplFacet = new Ext.XTemplate(
    '<tpl for=".">',
        '<div class="facet">',
            //ignore - (this is handled in title of panel) '<label class="facet_field">{facetName}</label>',   
            '<tpl for="facetEntries">',
                '<div class="facet_item">{value}&nbsp;&nbsp;({count})</div>',
            '</tpl>',
        '</div>',
    '</tpl>'
);
4

0 に答える 0