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
Comparing VPS Hosting Providers with Global Data Centers
Comparing VPS Hosting Provider...

It can be hard to find the best VPS hosting UAE provider with global data centers in today’s market. The majority...

Read More

Jun-26-2024

How to Clear Form Data Using jQuery
How to Clear Form Data Using j...

In this concise tutorial, we will explore the process of clearing form data efficiently using jQuery. We will focus on r...

Read More

Jul-13-2021

How to Schedule Cron Job Based on Time zone in Laravel
How to Schedule Cron Job Based...

Scheduling tasks using cron jobs in Laravel is a powerful way to automate repetitive processes like sending emails, clea...

Read More

Jan-14-2025

How to Use Laravel Factory in Seeder
How to Use Laravel Factory in...

Laravel is a popular PHP framework known for its elegance and simplicity in building web applications. When it comes to...

Read More

Sep-13-2023