mehmetydm
mehmetydm

Reputation: 65

Extjs Combobox set color to specific item

Is there a way to set color of last item (or last two items) of combobox items, i tried to use TPL but didn't work. Here is the TPL defination with XTeplate which was defined before i updated. Thanks a lot.

var resultTplHesap103Ekod = new Ext.XTemplate(
 '<tpl for="."><div class="x-combo-list-item">',
 '<h3><span> {val}  </h3>',
 '<span style="color:blue"> {dsc}  </span>', '</div></tpl>'
);

From @MMT,

I changed codes like this.

var resultTplHesap360Ekod = new Ext.XTemplate(
        '<tpl for=".">',
            '<tpl if="(xindex ) &gt; (xcount-1)">',
               '<tpl>',
                    '<div class="x-combo-list-item">',
                    '<h3> {val}  </h3>',
                    '<span style="color:red"> {dsc}  </span>', 
                    '</div>',
               '</tpl>',
            '</tpl>',

            '<tpl if="(xindex ) &lt; (xcount-2)">',
               '<tpl>',
                    '<div class="x-combo-list-item">',
                    '<h3> {val}  </h3>',
                    '<span style="color:blue"> {dsc}  </span>', 
                    '</div>',
               '</tpl>',
            '</tpl>',
        '</tpl>'
    );

var comboHsp360EkodHarcama = new Ext.form.ComboBox({
            fieldLabel : '',
            labelSeparator : '',
            triggerAction : 'all',
            mode : 'local',
            store : storeHesapTasinirHeskod360,
            displayField : 'dsc',
            valueField : 'val',
            emptyText : 'Damga Vergisi Türü',
            forceSelection : true,
            hidden : true,
            forceSelection : true,
            tpl : resultTplHesap360Ekod,
            width : 300,
            listClass : 'x-combo-list-item'
        });

var storeHesapTasinirHeskod360 = new Ext.data.JsonStore({
            url : '../gen/hesapTasinir.ajax',
            root : 'list',
            fields : ['dsc', 'val']
        });

Now code is working thank a lot @MMT, the last item (for now) is red that was important for me, but now i have another problem. When i select this last RED item it appears black in text fiel at the top ob box. Could you please help me to make it remain RED. Regards.

Upvotes: 0

Views: 5282

Answers (1)

MMT
MMT

Reputation: 2216

try this

    var tpl = new Ext.XTemplate(
        '<tpl for=".">',
            '<tpl if="(xindex ) &gt; (xcount-2)">',
               '<tpl>',
                    '<div class="x-combo-list-item">',
                    '<h3> {value}  </h3>',
                    '<span style="color:red"> {name}  </span>', 
                    '</div>',
               '</tpl>',
            '</tpl>',

            '<tpl if="(xindex ) &lt; (xcount-2)">',
               '<tpl>',
                    '<div class="x-combo-list-item">',
                    '<h3> {value}  </h3>',
                    '<span style="color:blue"> {name}  </span>', 
                    '</div>',
               '</tpl>',
            '</tpl>',

        '</tpl>'
    );

Upvotes: 2

Related Questions