Angular UI bootstrap datepicker

Question

I'm using Angular UI bootstrap's datepicker , and when I change programmatically the date the view doesn't change, when I'm in 30 Novembre and I programmatically change the date to 2 December, the date change but the view still fixed in November, here's how I code the next date button.

$scope.right=function(){
    if($scope.viewmodel.timeResolution=='yearly')
        $scope.dt.setFullYear($scope.dt.getFullYear()+1);
    else if($scope.viewmodel.timeResolution=='monthly')
        $scope.dt.setMonth($scope.dt.getMonth()+1);
    else if($scope.viewmodel.timeResolution=='daily') {
        $scope.dt.setDate($scope.dt.getDate() + 1);
    }
    $scope.changedValue();
};

Html :

 <uib-datepicker ng-model="dt" id="dp" datepicker-mode="mode" init-date="initDate" show-weeks=false max-mode="maxMode"  min-date="minDate" max-date="maxDate" min-mode="minMode" class="well well-sm"  ng-change="changedValue(viewmodel.dt)"></uib-datepicker>

how can I simulate a refresh view everytime I change the date programmatically on the datepicker ?

@azelix is there business rule to add date? are you try to disable weekend ? — user474901
– user474901, Commented Jan 7, 2016 at 12:30

Joao Polo · Accepted Answer · 2016-01-07 14:04:33Z

1

you need to convert again to date. The function set... only returns the timestamp:

$scope.right=function(){
    if($scope.viewmodel.timeResolution=='yearly')
        $scope.dt = new Date($scope.dt.setFullYear($scope.dt.getFullYear()+1));
    else if($scope.viewmodel.timeResolution=='monthly')
        $scope.dt = new Date($scope.dt.setMonth($scope.dt.getMonth()+1));
    else if($scope.viewmodel.timeResolution=='daily') {
        $scope.dt = new Date($scope.dt.setDate($scope.dt.getDate() + 1));
    }
    $scope.changedValue();
};

answered Jan 7, 2016 at 14:04

Joao Polo

2,1631 gold badge17 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Joao Polo Over a year ago

I don't know about your changedValue() function, but the datepicker doesn't need any other call to work.

azelix Over a year ago

You saved me here, your answer is spot on, now it works nicely, and for the changedValue() it does generate Maps and time series i mean by that it dosent have anything to do with the datepicker itself.

Joao Polo Over a year ago

You're welcome. I had some problems with timezone too, using that component, but it can vary according to your backend implementation.

davidkelly · Accepted Answer · 2016-01-07 13:33:18Z

0

To make your overall experince with angular dates better, you should look into moment .js

http://momentjs.com/

It allows you to create, format, add and subtract dates easily and with minimal issues. Using the default date.set functions can cause a lot of issues.

I have a set up like this using moments with no issues

answered Jan 7, 2016 at 13:33

davidkelly

236 bronze badges

1 Comment

azelix Over a year ago

It may be an issue i'll look into that later, but that's not the issue i'm having now, the date change as i wanted it there's no problem with the date but the view of my datepicker dosent follow the date when per example the month change from November to December

Collectives™ on Stack Overflow

Angular UI bootstrap datepicker

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related