Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery DatePicker - Enable Specific Day - Code Not Working

I cannot for the life of me work out why this code isn't working. I'm sure that I'm doing something really stupid, but I just cant find it! I'm currently just trying to disable all the dates bar "7-8-2013". Any help on this would be greatly appreciated. Thanks!

<!doctype html>


<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>Calender Control Test</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <script>

var enableDays = ["7-8-2013"];


 $(function enableAllTheseDays(date) {
    var m = date.getMonth(), var d = date.getDate(), var y = date.getFullYear();
    for (i = 0; i < enableDays.length; i++) {
        if($.inArray((d+1) + '-' + m + '-' + y,enableDays) != -1) {
            return [true];
            }
        }
        return [false];


    $('#datepicker').datepicker({dateFormat: 'dd-mm-yy', beforeShowDay: enableAllTheseDays});

  </script>
</head>
<body>



<div id="datepicker"></div>


</body>
</html>
like image 781
user2014175 Avatar asked Aug 02 '13 07:08

user2014175


People also ask

How do I enable only certain dates in DatePicker?

To achieve this function, you can use beforeShowDay in the datepicker to do it.

How do I disable date range picker?

DateRangePicker can be inactivated on a page, by setting enabled value as false that will disable the component completely from all the user interactions including in form post.

What is the default value of DatePicker?

By default, the DatePicker value is null and the Calendar popup is hidden. The DatePicker provides options for: Setting its default value.

What is DatePicker format?

By default, the date format of the jQuery UI Datepicker is the US format mm/dd/yy, but we can set it to a custom display format, eg: for European dates dd-mm-yyyy and so on. The solution is to use the date picker dateFormat option.


1 Answers

Try

jQuery(function(){

    var enableDays = ["7-8-2013"];

    function enableAllTheseDays(date) {
        var sdate = $.datepicker.formatDate( 'd-m-yy', date)
        if($.inArray(sdate, enableDays) != -1) {
            return [true];
        }
        return [false];
    }

    $('#datepicker').datepicker({dateFormat: 'dd-mm-yy', beforeShowDay: enableAllTheseDays});
})

Demo: Fiddle

like image 164
Arun P Johny Avatar answered Oct 08 '22 14:10

Arun P Johny