minDate/maxDate problem

[robertkrantz]

Hello

I have a form that contains two input fields, each with a datepicker. After adding the timepicker addon it does not work as intended.

When selecting a date in the first datetimepicker it should set the minDate of the second one but ends up changing the actual date in it while at the same time messing up the hours.

When the hours are set to a value below or equal to 12 in the first input field it becomes 00 in the second. If the hours are above 12 the value in the second input field is equal to the set value + 2.

The code used for min/max dates is the one posted below.

onSelect : function(selectedDate) {
var option = this.id == "dateFrom" ? "minDate" : "maxDate";
var instance = $(this).data("datepicker");
var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
datePickers.not(this).datetimepicker("option", option, date);
}

Now it is not impossible that I have missed some aspect to using this addon and that the above code is faulty and if so is I apologize but I have been at this problem for a few hours now and it is driving me crazy. :)

I have done some debugging and at least the time issue seems to located to the $.datepicker._setDate function at line 828 but I might be wrong.

It should be noted I am using the latest version, 0.8.

Any help or insight is appreciated
Regards
Robert Krantz

[trentrichardson]

Do you get any errors? or just acting funny? To be completely honest there has not been much testing on multiple input fields..

[robertkrantz]

The only error I got was when trying to swap datepicker for datetimepicker on the rows:

        var instance = $(this).data("datepicker");
        var date = $.datepicker.parseDate(instance.settings.dateFormat ||  $.datepicker._defaults.dateFormat, selectedDate, instance.settings);

And that was only the "there is no X for undefined" error

[trentrichardson]

A user submitted many changes last night and I committed them, can you see if this version 0.8.1 fixed it? (it may not have, there were a ton of changes however)

[robertkrantz]

It works better but it still behaves strange and once again I don't really have the time to look into this at work but the debugging I did points to the setDate function. It doesn't change the date of the other input field and the disabling of earlier and later dates work. However, it still changes the time to what I described in my original post.

It should be noted that the datepicker dialog closes once a date is selected but that is due to line 560 being one row down, easy fix.

I wish I had time to really dig into this but I'm buried in stuff to do at the moment.

[Jean-Marc68]

Hello everybody and, first, congratulation to trentrichardson for his job.

I also have au little problem with the beforeShow what seems to not work.
Here down you'll find my code. If you replace .datetimepicker by .datepicker the code is working, but not with the datetimepicker. Il don't understand what do I wrong.

Thanks for your advices.

My version of dateTimePicker is 0.9.1

My code is :
var $j = jQuery.noConflict();
$j(function() {
$j("#ouverture").datetimepicker({showOn: "both",
speed: 'fast',
beforeShow: OptionsOuverture,
numberOfMonths: 2,
hideIfNoPrevNext: true,
timeOnlyTitle: 'Choissez l'heure',
timeText: 'Heure :',
hourText: 'Heures',
minuteText: 'Мinutes',
secondText: 'secondes',
currentText: 'Maintenant',
hour: 9,
minute: 0,
ampm: false
});
$j("#fermeture").datetimepicker({showOn: "both",
speed: 'fast',
beforeShow: OptionsOuverture,
numberOfMonths: 2,
hideIfNoPrevNext: true,
timeOnlyTitle: 'Choissez l'heure',
timeText: 'Heure :',
hourText: 'Heures',
minuteText: 'Мinutes',
secondText: 'secondes',
currentText: 'Maintenant',
hour: 15,
minute: 30,
ampm: false
});
});

function OptionsOuverture()
{
    var dateMin = new Date();
    var dateMax = null;
    if ($j("#fermeture").datepicker("getDate") != null)
    {
        dateMax = $j("#fermeture").datepicker("getDate");
    }
    var Now = new Date();
    if (Now.getMonth()>3)
    {
        dateMax = new Date(Now.getFullYear()+1,3,30,0,0,0);
    }
    else 
    {
        dateMax = new Date(Now.getFullYear(),3,30,0,0,0);
    }
    return {
            minDate: dateMin, 
            maxDate: dateMax
            }
}

function OptionsFermeture()
{
    var dateMin = new Date();
    var dateMax = null;
    if ($j("#ouverture").datepicker("getDate") != null)
    {
        dateMin = $j("#ouverture").datepicker("getDate");
    }
    var Now = new Date();
    if (Now.getMonth()>3)
    {
        dateMax = new Date(Now.getFullYear()+1,3,30,0,0,0);
    }
    else 
    {
        dateMax = new Date(Now.getFullYear(),3,30,0,0,0);
    }
    return {
            minDate: dateMin, 
            maxDate: dateMax
            }
}

[doublerebel]

Hello Jean,

Please open a separate Issue, as you are not having a minDate/maxDate problem. I've also changed the way beforeShow is called, you can try pulling from my dev branch.

[Jean-Marc68]

Thanks for your advice, doublerebel. Following your recommandation, il maded a new issue for my beforeshow problem. You said also I can try pulling from your dev branch. Where can I found that dev branch. Sorry il that question seems basic, but I don't where to look.
Thanks

[trentrichardson]

If you go to doublerebel's timepicker page there is a button on the top left for Branches, choose his unstable branch

[Jean-Marc68]

Thanks,
Reading the code I found on the unstable branch, espacially between lines 96 and 143, I understand the datepicker's options are loaded.
Because I didn't really understood your way to call the beforeShow but know the datpicker's options will be called, I wrote the following code.
That code is running, but ther is an alf second delay on opening. Not a problem at opening, but an alf second occurs also on month changing. The next month appear, and an alf second later, the month is flashing an become usable.
It's working, but I'm sur it's not the right way to operate.
Also default hour and minute aren't working when I use beforeShow. Perhaps because I don't really understand how must I call de beforeShow.

Here is my code :
var $j = jQuery.noConflict();
$j(function() {
$j("#ouverture").datetimepicker({showOn: "both",
numberOfMonths: 2,
beforeShow: OptionsOuverture,
hideIfNoPrevNext: true,
timeOnlyTitle: 'Choissez l'heure',
timeText: 'Heure :',
hourText: 'Heures',
minuteText: 'Мinutes',
secondText: 'secondes',
currentText: 'Maintenant',
hour: 9,
minute: 0,
ampm: false
});
$j("#fermeture").datetimepicker({showOn: "both",
numberOfMonths: 2,
beforeShow: OptionsFermeture,
hideIfNoPrevNext: true,
timeOnlyTitle: 'Choissez l'heure',
timeText: 'Heure :',
hourText: 'Heures',
minuteText: 'Мinutes',
secondText: 'secondes',
currentText: 'Maintenant',
hour: 15,
minute: 30,
ampm: false
});
});

function OptionsOuverture()
{
    var dateMin = new Date();
    var dateMax = null;
    if ($j("#fermeture").datepicker("getDate") != null)
    {
        dateMax = $j("#fermeture").datepicker("getDate");
    }
    var Maintenant = new Date();
    if (Maintenant.getMonth()>3)
    {
        dateMax = new Date(Maintenant.getFullYear()+1,3,30,0,0,0);
    }
    else 
    {
        dateMax = new Date(Maintenant.getFullYear(),3,30,0,0,0);
    }
    $j("#ouverture").datepicker('option', {
                                    minDate: dateMin, 
                                    maxDate: dateMax
                                });
}

function OptionsFermeture()
{
    var dateMin = new Date();
    var dateMax = null;
    if ($j("#ouverture").datepicker("getDate") != null)
    {
        dateMin = $j("#ouverture").datepicker("getDate");
    }
                var Maintenant = new Date();
    if (Maintenant.getMonth()>3)
    {
        dateMax = new Date(Maintenant.getFullYear()+1,3,30,0,0,0);
    }
    else 
    {
        dateMax = new Date(Maintenant.getFullYear(),3,30,0,0,0);
    }
    $j("#fermeture").datepicker('option', {
                                minDate: dateMin, 
                                maxDate: dateMax
                                }); 
}