[Solved]ngCordova: $cordovaDatePicker.show() callback is never called

The title says it all, after selecting a date the callback is not called using the $cordovaDatePicker wrapper.

Works fine if I call window.datepicker directly

view:

<div class="list" data-ec5-date>
<label class="item item-input item-stacked-label">
    <span class="input-label">{{label}} ({{format}})</span>
    <!-- <input type="text" ng-model="inputNavParams.current_value" ng-click="datePicker()" data-ec5-date readonly> -->
    <button class="button button-block button-stable icon-left ion-calendar" ng-click="datePicker()" data-instantActivate>
        <span>Tap to set date</span><span>{{inputNavParams.current_value}}</span>
    </button>
</label>

directive:

//directive to handle date selection via native date picker (Cordova plugin)
	module.directive('ec5Date', function($cordovaDatePicker) {
		return {
			restrict : "AE",
			replace : false,
			link : function(scope, elem, attrs) {

				//cache current index
				var c_index = scope.inputNavParams.current_position - 1;

				//update label
				scope.label = scope.inputs.list[c_index].label;

				//show date format (set via form builder)
				scope.format = scope.inputs.list[c_index].datetime_format;

				//display cached/default/empty value on view
				scope.setCachedValue(c_index);

				scope.datePicker = function() {

					// $cordovaDatePicker.show({
					// date : new Date(),
					// mode : "date"
					// }, function(date) {
					// console.log(date);
					// });

					var options = {
						date : new Date(),
						mode : 'date'
					};

					window.datePicker.show(options, function(date) {
						console.log("date result " + date);
					});

				};

			}
		};
1 Like

I think the problem is that you are trying to use a callback instead of a promise. ngCordova wraps the Cordova API’s in promises.

angular.module('ngCordova.plugins.datePicker', [])

  .factory('$cordovaDatePicker', ['$window', '$q', function ($window, $q) {

    return {
      show: function(options) {
        var d = $q.defer();

        $window.datePicker.show(options, function (date) {
          d.resolve(date);
        });

        return d.promise;
      }
    }

  }]);

Try this instead:

window.datePicker.show(options).then(
  function(date) {
    console.log("date result " + date);	
  }
);

Good to know, I was using the sample code from ngCordova docs, which is plain wrong then

For some reason the date picker doesnt work at all.