"Date time picker" datum regel.

Status
Niet open voor verdere reacties.
Het is een beetje gissen waar het verkeerd gaat, want in beide gevallen (minDateTime en maxDateTime) wordt er een Date-object meegegeven.

Bij minDate gaat hij er wel goed mee om, maar bij maxDate niet :(

Werkt het wanneer je alleen maxDate gebruikt?
[js]
onSelect: function (selectedDateTime)
{
//var tempDate = new Date(startDateTextBox.datetimepicker('getDate'));
//endDateTextBox.datetimepicker('option', 'minDateTime', tempDate);
var tempDate = tempDate.setDate(tempDate.getDate() + 7);
endDateTextBox.datetimepicker('option', 'maxDateTime', tempDate);
}[/js]

Werkt het wanneer je er een Time-string van maakt?
[js]onSelect: function (selectedDateTime)
{
var tempDate = new Date(startDateTextBox.datetimepicker('getDate'));
endDateTextBox.datetimepicker('option', 'minDateTime', tempDate);
tempDate = tempDate.setDate(tempDate.getDate() + 7);
endDateTextBox.datetimepicker('option', 'maxDateTime', tempDate.valueOf());
}[/js]
 
Als ik dat eerste stuk uitvoer krijg ik dit:

'undefined' is null or not an object on line 152:
PHP:
var tempDate = tempDate.setDate(tempDate.getDate() + 7);

En bij het tweede stukje krijg ik weer de gewone fout van regel 620.
 
Oh ja, hij kent tempDate natuurlijk nog niet :D
[js]
onSelect: function (selectedDateTime)
{
//var tempDate = new Date(startDateTextBox.datetimepicker('getDate'));
//endDateTextBox.datetimepicker('option', 'minDateTime', tempDate);
var tempDate = new Date();
tempDate = tempDate.setDate(tempDate.getDate() + 7);
endDateTextBox.datetimepicker('option', 'maxDateTime', tempDate);
}[/js]
 
En dit werkt wel?
[js]onSelect: function (selectedDateTime)
{
var tempDate = new Date(startDateTextBox.datetimepicker('getDate'));
//endDateTextBox.datetimepicker('option', 'minDateTime', tempDate);
//tempDate = tempDate.setDate(tempDate.getDate() + 7);
endDateTextBox.datetimepicker('option', 'maxDateTime', tempDate);
}[/js]
Nu wordt de maxDate van het eindveld ingesteld op de datum van het startveld.
 
En dit:
[js]onSelect: function (selectedDateTime)
{
var tempDate = new Date(startDateTextBox.datetimepicker('getDate') + 7);
console.log(tempDate);
//endDateTextBox.datetimepicker('option', 'minDateTime', tempDate);
//tempDate = tempDate.setDate(tempDate.getDate() + 7);
endDateTextBox.datetimepicker('option', 'maxDateTime', tempDate);
}[/js]

Al vermoed ik dat het resultaat "22 mei 20147" zal worden. :confused:
 
JA hij doet inderdaad wat je vermoedde

LOG: Mon May 22 16:31:00 UTC+0200 20147
 
Waardeloos dus :(

Probeer de "dev"-branch eens: https://github.com/trentrichardson/jQuery-Timepicker-Addon/tree/dev
Rechterbalk -> Download ZIP

Daar zitten aardig wat wijzigingen in, misschien werkt die wel beter.
Even downloaden dus en testen met deze code:
[js]onSelect: function (selectedDateTime)
{
var tempDate = new Date(startDateTextBox.datetimepicker('getDate'));
endDateTextBox.datetimepicker('option', 'minDateTime', tempDate);
tempDate = tempDate.setDate(tempDate.getDate() + 7);
endDateTextBox.datetimepicker('option', 'maxDateTime', tempDate);
}[/js]
 
Oke ik heb dit gedownload en gekoppeld. Alleen krijg ik nogsteeds deze error:

Object doesn't support this property or method on line 624
PHP:
maxDateTimeDate = new Date(maxDateTime.getFullYear(), maxDateTime.getMonth(), maxDateTime.getDate(), 0, 0, 0, 0);
 
Zoals het daar staat wordt bij initialisatie er voor gekozen om het startveld een bereik te geven tussen de huidige datum en 2 jaar later.

Bij de onSelect wordt van het bereik van het eindveld vastgezet tussen de gekozen datum van startveld en 2 jaar na de huidige dag.

Let wel dat ze daar met de standaard datepicker van jQuery UI werken, het kan zijn dat de timepicker bepaalde functies overschrijft van de standaard datepicker en het daarom anders reageert.
 
Hoe ik het eerst had:
PHP:
var startDateTextBox = $('#startDate');
var endDateTextBox = $('#endDate');
 
startDateTextBox.datetimepicker({ 
    timeFormat: 'HH:mm z',
    minDate: 0,
    onClose: function(dateText, inst) {
        if (endDateTextBox.val() != '') {
            var testStartDate = startDateTextBox.datetimepicker('getDate');
            var testEndDate = endDateTextBox.datetimepicker('getDate');
            if (testStartDate > testEndDate)
                endDateTextBox.datetimepicker('setDate', testStartDate);
        }
        else {
            endDateTextBox.val(dateText);
        }
    },
    onSelect: function (selectedDateTime){
        endDateTextBox.datetimepicker('option', 'minDate', startDateTextBox.datetimepicker('getDate') );
    }
});
endDateTextBox.datetimepicker({ 
timeFormat: 'HH:mm z',
showTimezone: false,
timezoneList: false,
maxDate:7,
    onClose: function(dateText, inst) {
        if (startDateTextBox.val() != '') {
            var testStartDate = startDateTextBox.datetimepicker('getDate');
            var testEndDate = endDateTextBox.datetimepicker('getDate');
            if (testStartDate > testEndDate)
                startDateTextBox.datetimepicker('setDate', testEndDate);
        }
        else {
            startDateTextBox.val(dateText);
        }
    },
    onSelect: function (selectedDateTime){
        startDateTextBox.datetimepicker('option', 'maxDate', '+7d' );
    }
});

minDate: 0;

en bij de 2e
maxDate:7;

Het werkt wel alleen doet die dat op de dag van vandaag en niet op de dag van de geselecteerde in select box 1.
misschien kunnen we hierop verder borduren?
 
Dat heeft hoogstwaarschijnlijk met deze regel te maken:
[js]startDateTextBox.datetimepicker('option', 'maxDate', '+7d' );[/js]
Daar staat nu +7d ten opzichte van vandaag, die waarde moet dus relatief worden.

De enige manier waarop dat kan is door gebruik te maken van
[js]startDateTextBox.datetimepicker('getDate');[/js]
en die te manipuleren, alleen er een nieuw Date-object van maken werkt dus blijkbaar niet aangezien ik dat al geprobeerd heb.
 
Heel erg bedankt voor de hulp maar het bleek wat anders te zijn, ik heb er samen met iemand naar gekeken en we zijn er uitgekomen!

Toch nog bedankt voor je hulp en ik zal de oplossing plaatsen zodat anderen hier ook nog wat aan hebben!
Top dat je mee hebt geholpen met dit lastige probleem!
[js]
var startDateTextBox = $('#startDate');
var endDateTextBox = $('#endDate');
var tmpDateTextBox = $('#tmpDate');
var maxOffset = 0;

startDateTextBox.datetimepicker({
timeFormat: 'HH:mm z',
minDate: 1,
onClose:
function(dateText, inst) {
var StartDate = startDateTextBox.datetimepicker('getDate');
var newDate = new Date(StartDate.getFullYear(), StartDate.getMonth(), StartDate.getDate()+7) ;
var currentDate = new Date();
var maximDate = dateFormat(newDate,"mm/dd/yyyy hh:mm o");
maxOffset = days_between(newDate, currentDate);
//document.write(maxOffset);
$('#endDate').val(maximDate);
endDateTextBox = $('#endDate');
$("#endDate").datepicker("change",{ maxDate: new Date($('#endDate').val()) } );
},
onSelect: function (selectedDateTime){
endDateTextBox.datetimepicker('option', 'minDate',startDateTextBox.datetimepicker('getDate') );
}
});


endDateTextBox.datetimepicker({
timeFormat: 'HH:mm z',
//showTimezone: false,
//timezoneList: false,
minDate: 1,
//maxDate: new Date(newDate),
onClose:
function(dateText, inst) {
//if (startDateTextBox.val() != '') {
// var endDate = startDateTextBox.datetimepicker('getDate');
var EndDate = endDateTextBox.datetimepicker('getDate');
// if (testStartDate > testEndDate)
// startDateTextBox.datetimepicker('setDate', testEndDate);
//}
//else {
// startDateTextBox.val(dateText);
//}
},
onSelect: function (selectedDateTime){
//startDateTextBox.datetimepicker('option', 'maxDate', '+7d' );
//var tempDate = new Date(endDateTextBox.datetimepicker('getDate'));
//startDateTextBox.datetimepicker('option', 'maxDate', tempDate.setDate(tempDate.getDate() + 7));
}
});
[/js]
 
Laatst bewerkt door een moderator:
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan