Search code examples
javascriptcsstimesencha-touch-2datetimepicker

Sencha Touch 2 date picker component & css: how to display hidden column names?

I'm using the date&time picker that can display ['month', 'day', 'year','hour','minute','ampm']. The source is here: https://bitbucket.org/nilsdehl/sencha-touch-2-sencha.io-example/src/cb29bfa284b2/sdk/src/picker/Date.js?at=master

Everything works fine, but the datepicker does NOT display the titles. That's all I want. They are displayed on the html page, but they are css hidden.

For example, the code generates Month on the page this way:

<div class="x-unsized x-picker-slot-title x-dock-item x-docked-top x-has-width x-item-hidden" id="ext-component-268" style="display: none!important;">
  <div class="x-innerhtml " id="ext-element-712">Month</div>
</div>

As you can see, the style is display: none!important; How to overwrite it?

I'm sure there is a way to show the column names by changing some options in the .js file, not by overwriting css style. Does anybody know that (kind of 'ShowTitles') option?

Anyway, I have no luck to find any of these ways to solve my question.

So, how to remove style="display: none!important;" ?

Solution

  • I've found the solution! Add a string

    useTitles: true,

    in the config:{}.