Phonegap DateTime Picker plugin compatible with platforms Android,Ios and Windows Phone

Question

Could you please suggest me any Phonegap DateTime Picker plugin that is compatible with platforms Android,Ios and Windows Phones?

Answer 1

We have number of plugins avail for datepicker, As I tried this already, I would recommend you to follow below steps to make it work,

Step 1: Run the following command

cordova plugin add https://github.com/mrfoh/cordova-datepicker-plugin

Step 2: Handle the click

$('.nativedatepicker').focus(function(event) {
    var currentField = $(this);
    var myNewDate = Date.parse(currentField.val()) || new Date();

    // Same handling for iPhone and Android
    window.plugins.datePicker.show({
        date : myNewDate,
        mode : 'date', // date or time or blank for both
        allowOldDates : true
    }, function(returnDate) {
        var newDate = new Date(returnDate);
        currentField.val(newDate.toString("dd/MMM/yyyy"));

        // This fixes the problem you mention at the bottom of this script with it not working a second/third time around, because it is in focus.
        currentField.blur();
    });
});

$('.nativetimepicker').focus(function(event) {
    var currentField = $(this);
    var time = currentField.val();
    var myNewTime = new Date();

    myNewTime.setHours(time.substr(0, 2));
    myNewTime.setMinutes(time.substr(3, 2));

    // Same handling for iPhone and Android
    plugins.datePicker.show({
        date : myNewTime,
        mode : 'time', // date or time or blank for both
        allowOldDates : true
    }, function(returnDate) {
      // returnDate is generated by .toLocaleString() in Java so it will be relative to the current time zone
        var newDate = new Date(returnDate);
        currentField.val(newDate.toString("HH:mm"));

        currentField.blur();
    });
});

Step 3: You may need to convert the result of date.parse() back to an object to get the picker to work a second or third time around. If so, try inserting this code after the myNewDate declaration:

if(typeof myNewDate === "number"){ myNewDate = new Date (myNewDate); }