Menu ▼



Posted By :
avatarmrkraju
Total Views : 37913

JQuery Date Picker example to disable previous dates.

In this example we will see how to disable the previous date selection in JQuery UI date picker. To disable the previous dates we need to set the minDate property of date picker. if we set minDate:0 then it will disable all the previous dates.

Example
Date :

JQuery
<script language="javascript">
    $(document).ready(function () {
        $("#txtdate").datepicker({
            minDate: 0
        });
    });
</script>

Source Code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css" rel="Stylesheet"
        type="text/css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <script language="javascript">
        $(document).ready(function () {
            $("#txtdate").datepicker({
                minDate: 0
            });
        });
    </script>
</head>
<body>
    Date :
    <input id="txtdate" type="text">
</body>
</html>






comments powered by Disqus


Search dotnetlearners.com