Customize date format in DatePicker(angular Bootstrap directive)

[skumar mohan]

I am using AngularStrap Bootstrap Directive for DatePicker as follows: 

<input type="text" ng-model="startDate" data-date-format="dd/mm/yyyy" bs-datepicker>

<button type="button" class="btn" data-toggle="datepicker"><i class="icon-calendar"></i></button>

I am saving this data to json file, but I get date in this format "Sat Jul 20 2013 05:30:00 GMT+0530 (India Standard Time)"

How do I get date in this required format "2013-07-20T00:00:00.000Z" ??

[Spas Bobchev]

I would try formatting the date value and then save it:

var dateFilter = $filter('date');

var formattedDate = dateFilter(startDate, 'yyyy-MM-ddTHH:mm:ss.SSSZ');

[Brad McAlister]

How could I do this with an array of dates? I will have an unknown number of items repeated using ng-repeat and each one has a datepicker. I can specify the filter on individual models but I"m not sure how to apply it across any date in the array. The end result I'm after is to be able to pull a row from ng-grid, edit the dates, then push it back into the grid to reflect the changes.

http://plnkr.co/edit/pPdZ6lDrgkr4ntDBwnpF?p=preview

[Spas Bobchev]

A quick and very dirty solution is to observe '$scope.dt' for changes:

$scope.$watch('dt', function(n, o) {

  if (n !== o) {

    angular.forEach($scope.dt, function(job, jobKey) {

      angular.forEach(job, function(jobData, jobDataKey) {

        if (jobDataKey == 'Job') {

          angular.forEach(jobData, function(val, valKey) {

            angular.forEach(val, function(v, k) {

              if (k == 'StartDate') {

                var dateFilter = $filter('date');

                var formattedDate = dateFilter(v, 'MM/dd/yy');

                $scope.dt[jobKey].Job[valKey].StartDate = formattedDate;

              }

              if (k == 'EndDate') {

                var dateFilter = $filter('date');

                var formattedDate = dateFilter(v, 'MM/dd/yy');

                $scope.dt[jobKey].Job[valKey].EndDate = formattedDate;

              }

              if (!$scope.$$phase) {

                $scope.$apply();

              }

            });

          });

        }

      });

    });

  }

}, true);

A more elegant solution would be to write a 'on-change' directive or find one online.

[Brad McAlister]

Thanks, Spas.

I'm leaning towards doing this way if I can figure out how to make it work using datepicker-popup and not just on the datepicker element.

https://github.com/angular-ui/bootstrap/issues/973#issuecomment-24115915

If I can't get this way working I'll probably do the quick & dirty way for now.

Thanks!

[Gopi Nadendla]

var d1 = $filter('date')(

            new Date(),

            "yyyy-MM-dd T00:00:00 Z ");