How to update Time Restraints in Timepicker plugin?-Collection of common programming errors

11 years ago

admin

2 minutes

I’m using Timepicker plugin: http://trentrichardson.com/examples/timepicker/ . I want to update Time Restraints after date was changed. This’s my code:

var date = "10/02/2013";  // October, 02 2013
var time = "22:05";
$("#Date").datepicker({
                    minDate: 'today',
                    maxDate: date,
                    showOn: "button",
                    buttonImage: '@Url.Content("~/Images/Library/Calendar.png")',
                    buttonImageOnly: true,
                    onSelect: function (dateText) {
                        if (Date.parse(dateText) == Date.parse(date)) {
                            $('#Time').timepicker({
                                hourMax: time.split(':')[0],
                                minuteMax: time.split(':')[1]
                            });
                        }
                        else {

                            $('#Time').timepicker({
                                hourMax: 23,
                                minuteMax: 59
                            });
                        }
                    }
                });

I try to do it, but it doesn’t work

You have given two undefined variables ‘date’ and ‘time’, that probably you have defined elsewhere in the script (i assume) …

Assuming that these vars are, for example:
```
var date = "10/02/2013";  // October, 02 2013
var time = "22:05";
```
your code should work (i’ve tested it).

If you have a different date format you could try something like this:
```
 var fdate = "10/02/2013 22:05";
 var date = fdate.split(' ')[0];
 var time = fdate.split(' ')[1];
 .....
```

I find a way to resolve my problem: When I choose another day I destroy timepicker and recreate it again.

var date = "10/02/2013";
var time = "22:05";
$("#S-Date").datepicker({
                        minDate: 'today',
                        maxDate: date,
                        showOn: "button",
                        buttonImage: '@Url.Content("~/Images/Library/Calendar.png")',
                        buttonImageOnly: true,
                        onSelect: function (dateText) {
                            if (Date.parse(dateText) == Date.parse(date)) {
                                $("#S-Time").val(formatTime12(time));
                                $('#S-Time').timepicker('destroy');
                                $('#S-Time').timepicker({
                                    hourMax: time.split(':')[0],
                                    minuteMax: time.split(':')[1]
                                });
                            }
                            else {
                                $('#S-Time').timepicker('destroy');
                                $('#S-Time').timepicker({
                                    hourMax: 23,
                                    minuteMax: 59
                                });
                            }
                        }
                    });