bgartenmann/Ext.ux.touch.DateTimeRangePicker

Ext.ux.touch.DateTimeRangePicker¶ ↑

An iOS-like DateTimeRangePicker, similar to the one found in the calendar app.

Getting started¶ ↑

• download or clone repo

• add all .js files to your index.html, like:

  <script type="text/javascript" src="path/to/Ext.ux.touch.DateTimeRangePicker/DateTimePicker.js"></script>
  <script type="text/javascript" src="path/to/Ext.ux.touch.DateTimeRangePicker/DateTimePickerField.js"></script>
  <script type="text/javascript" src="path/to/Ext.ux.touch.DateTimeRangePicker/DateTimePickerPanel.js"></script>
  <script type="text/javascript" src="path/to/Ext.ux.touch.DateTimeRangePicker/DateTimeRangeField.js"></script>

• add .css file to your index.html:

  <link rel="stylesheet" href="path/to/Ext.ux.touch.DateTimeRangePicker/theme/datetimepicker.css" type="text/css">

• use it in your forms like any other field:

  { xtype: "datetimerangefield" }
  

For full examples see the provided index.html and main.js files¶ ↑