Home Ask Login Register

Developers Planet

Your answer is one click away!

Pushkar Kathuria February 2016

Selection bar implementation in xtype-selectfield same as datepickerfield

In Sencha touch version 2.3.0 we have xtype:'datepickerfield' for which we have a default bar that indicates the selected date.

Blue line indicates selected date

This selection blue bar can be modified using following css property.

.x-picker-bar {
  background: rgba(247, 109, 48, 0.6);

datepickerfield with changed CSS

Now we have another component with xtype:'selectfield'. I want to implement this bar to this component as well. How can this be implemented? Any suggestions?

enter image description here


Anand Gupta February 2016

Below css will serve your purpose Pushkar:

.x-picker-slot .x-dataview-item.x-item-selected {
    background: rgba(247, 109, 48, 0.6) !important;

Let me know it helps or not.

Post Status

Asked in February 2016
Viewed 2,421 times
Voted 13
Answered 1 times


Leave an answer

Quote of the day: live life