How To Disable Dates After Week In jQuery Datepicker

Websolutionstuff | Jun-29-2022 | Categories : Laravel PHP jQuery

In this tutorial, we will see how to disable dates after a week in jquery datepicker. In the date picker, we can disable dates after a week or month using the jquery UI date picker. The maximum selectable date. When set to null, there is no maximum. If you can set Relative dates must contain value and period pairs; valid periods are "y" for years, "m" for months, "w" for weeks, and "d" for days. For example, "+1m +7d" represents one month and seven days from today.

So, let's see how to disable dates after a week in jquery datepicker, jQuery datepicker disable dates after week, after week date disable in datepicker, disable dates in jquery UI datepicker, how to disable date after week or month in the calendar using javascript, bootstrap datepicker disable dates after specific days, datepicker disable future dates in javascript.

Example:

<!DOCTYPE html>
<html>
<head>
    <title>How To Disable Dates After Week In jQuery Datepicker - Websolutionstuff</title>
    <link href="http://code.jquery.com/ui/1.9.2/themes/smoothness/jquery-ui.css" rel="stylesheet" />
    <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <style type="text/css">
        .container{
            border-radius: 5px;
            padding:50px 20px;
            margin:30px auto;
            width:40%;
            border:2px solid #bbb;
            text-align: center;
        }
        input{
            padding:5px;
            background-color:#eeeeee;
        }
        h2{
            text-align: center;
            margin-top: 100px;
            font-weight: 600;
        }        
    </style>
</head>
<body>
    <h2>How To Disable Dates After Week In jQuery Datepicker - Websolutionstuff</h2>
    <div class="container">
        <label>Select Date :</label>
        <input type="text" id="datepicker">
    </div>
</body>
<script type="text/javascript">
    $(function() {
        $("#datepicker").datepicker({  maxDate: "+1w" });
    });
</script>
</html>

 

 

Output:

how_to_disable_dates_after_week_in_jquery_datepicker_output

 


You might also like:

Recommended Post
Featured Post
Laravel 9 Image Upload In Summernote Editor
Laravel 9 Image Upload In Summ...

In this article, we will see laravel 9 image upload in summernote editor. there are many editor available in l...

Read More

Mar-24-2022

Laravel 8 cURL HTTP Request Example
Laravel 8 cURL HTTP Request Ex...

Hello Friends, Today we will see how to make cURL HTTPs request in your laravel 8 application. This tu...

Read More

Apr-28-2021

How To Add Action Button In Angular 15 Material Datepicker
How To Add Action Button In An...

In this tutorial, I will guide you through the process of adding an action button to the Angular 15 Material datepicker...

Read More

Jul-07-2023

How to Remove Elements From JavaScript Array
How to Remove Elements From Ja...

Today we will learn how to remove elements from javascript array, you can use diffrents javascript array...

Read More

Apr-07-2021