Disable weekends and previous dates

Disable weekends and previous dates - AngularJS

I am using the below code to insert a date picker text box.

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"></script> <script> function MainController($scope) $scope.date = new Date(); </script> <body ng-app> <div ng-controller="MainController"> <input type="date" ng-model="date" value=" date: 'yyyy/MM/dd' " /> </body>

Angular JS Calendar

enter image description here

I would like to if the below is possible to implement;

A. disable weekends selection

B. disable previous dates (starting yesterday)

C. disable 4 days including today (ex. if today is 12 then from 12 to 17 should be disabled - which includes weekends as well that are already disabled)

I have done this using JQuery Datepicker but not able to do it with AngularJS. Please help.

Attached screenshot of Jquery Datepicker.

enter image description here

Is it possible to achieve A, B and C as mentioned? Please advise.

– Krishnam
Sep 11 '18 at 21:27

Thank you @georgeawg. I wanted to know if the above (A,B and C) are possible to achieve using the AngularJS method I am using because I could achieve the same using JQuery pickup calendar. I wanted to know if it is the right approach or do I need to do take a difference approach. Hope I am able to explain.

– Krishnam
Sep 11 '18 at 22:28

1 Answer
1

Here you are relying on browsers' implementation of <input>, which is not very powerful. Using this, you can't grey out specific dates, only ranges using min and max attributes (which makes your B objective achievable).

<input>

min

max

There are several solutions from the AJS community, including:

ui-date

md-datepicker

md-min-date

md-max-date

md-date-filter

Can you please check why the date picker is not showing up? jsfiddle.net/amogzcvu

– Krishnam
Sep 12 '18 at 0:15

I never use this Resources linker, seems it's involved in the issue. This forked fiddle works though. I only moved your JS to the HTML area, and removed the dual AJS loading (1 in Resources, 1 as the JS panel setting).

– Stock Overflaw
Sep 12 '18 at 0:47

Thanks a lot for your patience and all the help. It was really helpful.

– Krishnam
Sep 12 '18 at 2:15

Cheers mate! :)

– Stock Overflaw
Sep 12 '18 at 8:03

No idea from here, I'd say check the console and the source

– Stock Overflaw
Sep 12 '18 at 16:07

Thanks for contributing an answer to Stack Overflow!

But avoid …

To learn more, see our tips on writing great answers.

Required, but never shown

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

搜尋此網誌

Dfyjkt