We Keep Coding

How to select whole week on date picker angular material?

I want to select whole week on date picker with highligted on calander and want to choose first date of a week as values.
Eg if I select thursday select or highlight whole week from monday to sunday and restrict to overlap dates .
here is sample image

See the stackblitz link with the answer to your question.
Stackblitz Example

preventing Date-picker from auto-select a date

I am using and readonly datepicker (bootstrap) with disabled weekends and public holidays. When selecting a month/ year however it always selects the first day of the month or year and only moves on to the date selection if this first day is an invalid. The datepicker modal opens initially with the current day (which is also an invalid day ..on purpose) so it let me select an day but ones i go to month or even years before selecting a day of the current month, it populates it with the default of the first day of the month/year. is there a way to prevent this from happing and only updates the date ones day, month and year has been selected by the user.

Use setDate method you can clear input field state this way:
$("#datepicker").datepicker();
$("#datepicker").datepicker('setDate', null);

Try this code:
$('#datepicker').val('').datepicker('update');
Or
$('.datepicker').datepicker('update', '');
Source

Bootstrap datepicker: Start picking date from year

Normally when selecting dates from immediate vicinity of 'today', default behaviour (picking a day of month) works well but when picking birthdays I want the user to start picking the date from years. I looked at the docs but couldn't find any option to do this. I want the datepicker to open with years selection first. As shown in this picture:
I'm using this plugin: https://bootstrapdatepicker.readthedocs.io/en/latest/

Use startView option (0-days, 1-months, 2-years, see plugin docs):
$('#date').datepicker({
startView:2//
});

jQuery UI datepicker as "year calendar"

I'm trying to get a full year calendar from jQuery UI datepicker, where I can interact with weeks rather than days.
I already found how to do the weekly part, but now I would like to display the full year, for a result similar to this :
I managed to add the 12 months, using the numberOfMonths: 12, but how can I set them display as a grid? I tried to set a width to the container, but it doesn't do anything.
For the starting month, I find on an other topic that I can change default date to 1st January adding defaultDate: new Date(new Date().getFullYear(), 0,1). This indeed make the months starting on January, but it also move the current day selection to 1st January... I would prefer, if someone knew a way to keep the current day as default selection.
Then for the previous/next button, is it possible to make them changing year in stead of month ? Else I think I may cheat, by adding an event handler to click 12 times instead of 1.
Finally, I would like to move the next button back to the third month like in the picture. It may not be very hard using CSS, so I'm just curious if there might be a function to do it more easily.
Here's a JSFiddle for my current code http://jsfiddle.net/AVZJh/2553/

I finally found all the missing part, result : http://jsfiddle.net/AVZJh/2625/
Grid & mooving previous/next button was both done changing numberOfMonths to an array : numberOfMonths: [4,3]
Previous/next switching year in stead of month was done adding stepMonths:12
Starting at january without changing default date was done adding showCurrentAtPos: new Date().getMonth()

Why don't you try AnyTime. It has all the features you ask for.

Only display days of specific month in datepicker

I have a date picker and it is displaying a date. But the problem is each month is showing some days of previous month and also some days of next month which I don't want to be displayed. I want that each month should display days of that particular month.
For example let's say Month JUNE, here some days of month MAY and also some days of month JULY are displayed, but i want that only days of JUNE should be displayed. How can I do it? I am trying but no result is coming.
Here is the fiddle:
http://jsfiddle.net/cBwEK/

You can make the other month values invisible by adding:
​.datepicker .otherMonth {
visibility: hidden;
}
to your CSS. See the updated fiddle.