1

Does anyone have a solution to updating angular ui's disabled dates from a server response?

https://github.com/angular-ui/bootstrap/issues/779

You should create another directive that will require datepicker's controller. From your directive you should call the refreshView of the datepicker to reevalute the disabled dastes.

Does anyone have example code for that?

I'm trying to use angular ui datepicker so that the disabled dates are read from a server response. I change the datepicker's min date to force it to refresh.

I saw another stackoverflow page where the user had it refresh, but it relied on the datepicker calendar being clicked. Another one used set the date min attribute as the value of another field.

For me, I have a completely separate field from the date picker. When changed, it sends an http request to the server, and on a successful response the available dates are updated.

The only problem with changing the min date to force a refresh is that sometime's there same but with different dates to disable. I'm looking into changing a datepicker option I do not use to a random value to force a refresh.

Does anyone have a better way? I saw cross controller communication via a service, but this is a different module. I also saw a github issue where the datepicker controller can be

stampede76
  • 1,521
  • 2
  • 20
  • 36
  • 1
    Yeah, I ran into the same problem, async disabled dates. I modified the ui-bootstrap source in my project to deal with it. Basically I added a property to the directive that I pass a promise into, then every time I want the view to update I just call notify() on the promise and in the directive I had it make the internal calls it needed to update the disabled dates (it isn't a clean solution so I didn't submit patches). I had to also write in some logic to advance the selected date to the next enabled date. – shaunhusain Sep 15 '14 at 04:50
  • May you post code, like on plunker? – stampede76 Sep 15 '14 at 12:27
  • Are you using the inline version of `datepicker` or `datepicker-popup`? If you are using the inline version of `datepicker` then I can give you an answer using this [sample](http://plnkr.co/edit/Xwq7YtAD6qNHQw1aES3H?p=preview) that I created. The difference is that the popup version doesn't expose the controller, while the inline version does. – JoseM Sep 23 '14 at 16:25
  • I was using popup. I can switch to datepicker, and try just hiding it with an on focus, and animate the form row to grow in height. Thank you for your help. – stampede76 Sep 24 '14 at 17:06
  • Steve, could you share your code as an answer? Struggling with this exact same issue. – Andreas Klintberg Oct 05 '14 at 21:48
  • I switched to using a drop down for dates because I only needed a few dates. Can you use the one JoseM posted here, http://plnkr.co/edit/Xwq7YtAD6qNHQw1aES3H?p=preview and just hide and show the datepicker during form onFocus? – stampede76 Oct 06 '14 at 14:56
  • Thanks for your answer, wrote an answer to my own question regarding this using that plunker and JoseM:s comments here. But elaborated a bit, http://stackoverflow.com/questions/24985387/disable-dates-using-factory-response-ui-bootstrap-datepicker – Andreas Klintberg Oct 06 '14 at 23:18

2 Answers2

1

I've found a simple solution to this problem using a decorator: https://gist.github.com/cgmartin/3daa01f910601ced9cd3

Then, you only need to call $scope.$broadcast('refreshDatepickers') to refresh the datepickers.

IMPORTANT: For more recent ui-bootstrap datepicker library, you may need to replace 'datepickerDirective' with 'uibDatepickerDirective' if you are using datepicker with uib-datepicker element or attribute.

edrian
  • 4,501
  • 5
  • 31
  • 35
1

The angular bootstrap datepicker has datepicker-options

This user listed the solution: https://github.com/angular-ui/bootstrap/issues/2189#issuecomment-225685104

bogdandrumen commented on Jun 13 

Use datepicker-options="{minDate: yourScopeMinDate}"

which worked for me. I have two pickers, the second picker cannot be greater than the first one so if the first picker changes, the second picker's max date also changes.

wyu
  • 1,793
  • 17
  • 33