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 Example
Laravel 9 Image Upload Example

In this tutorial, I will explain the laravel 9 image upload example. image or file upload is the most common task in web...

Read More

Feb-28-2022

How To Image Upload Using Ajax In Laravel 9
How To Image Upload Using Ajax...

In this article, we will see how to image upload using ajax in laravel 9. Here, we will learn about image upload in...

Read More

Feb-07-2023

jQuery Datatable Hide/Show Column Based On Condition
jQuery Datatable Hide/Show Col...

In this article, we will see a jquery datatable hide/show column based on condition. Here, we will learn how to hide and...

Read More

Jan-26-2023

Laravel 9 Create Middleware For XSS Protection
Laravel 9 Create Middleware Fo...

In this article, we will see laravel 9 create middleware for XSS protection. Cross-site scripting is a type of...

Read More

Apr-30-2022