Still in progress....

DatePicker iOS Plugin for using PhoneGap / Cordova 3.0 and iOS 7

This is a re-write of the iOS DatePicker plugin hosted on https://github.com/phonegap/phonegap-plugins/tree/master/iOS/DatePicker to run with PhoneGap/Cordova 3.0 and iOS 7.

It includes more options and it is ready for iPhone and iPad.

Screen shots

iPhone (iOS 7)

iPad (iOS 7)

Installation

1. Make sure that you have Node and Cordova CLI or PhoneGap's CLI or Cordova Plugman installed on your machine.

Also you will need Xcode v.4.2 or newer to support the feature called "Automatic Reference Counting"

2. Add a plugin to your project using Cordova CLI:

cordova plugin add https://github.com/sectore/phonegap3-ios-datepicker-plugin

Or using PhoneGap CLI:

phonegap local plugin add https://github.com/sectore/phonegap3-ios-datepicker-plugin

Or using plugman CLI:

plugman --platform ios --project ./platforms/ios --plugin https://github.com/sectore/phonegap3-ios-datepicker-plugin

3a) Register plugin within config.xml of your app

<feature name="DatePicker">
    <param name="ios-package" value="DatePicker"/>
</feature>

3b) If you are using PhoneGap build service add to config.xml

<gap:plugin name="de.websector.datepicker" />

4. The clobber definition of the plugin is called datePicker. So you can reference to the plugin from anywhere in your code.

Example:

// defining options
var options = {
  date: new Date(),
  mode: 'date'
};
// calling show() function with options and a result handler
datePicker.show(options, function(date){
  console.log("date result " + date);  
});

Check section "Options" below to see all options.

Options

mode

The mode of the date picker.

Typ: String

Values: "date" / "time" / "datetime"

Default: 'datetime'

date

Selected date.

Typ: String

Default: new Date()

allowOldDates

Shows or hide dates earlier then selected date.

Typ: Boolean

Values: true / false

Default: true

allowFutureDates

Shows or hide dates after selected date.

Typ: Boolean

Values: true / false

Default: true

minDate (new)

Minimum date.

Typ: Date or empty String

Default: '' (empty String)

maxDate (new)

Maximum date.

Typ: Date or empty String

Default: '' (empty String)

doneButtonLabel (new)

Label of done button.

Typ: String

Default: 'Done'

doneButtonColor (new)

Hex color of done button.

Typ: String

Default: '#0000FF'

cancelButtonLabel (new)

Label of cancel button.

Typ: String

Default: 'Cancel'

cancelButtonColor (new)

Hex color of cancel button.

Typ: String

Default: '#000000'

x (new)

X position of date picker (iPad only). The position is absolute to the root view of the application.

Typ: String

Default: '0'

y (new)

Y position of date picker (iPad only). The position is absolute to the root view of the application.

Typ: String

Default: '0'

Requirements

• PhoneGap/Cordova 3.0 or newer
• iOS 7 or newer

Author of migration to PhoneGap 3.0

Jens Krause // WEBSECTOR.DE