0

I am working on a website where users can book vacation houses. Booking always is from Saturday to Saturday. If users click on any date in that week, the whole week must be selected. I've got that part working.

I gave the selected dates the "date-range-selected" class. And if the first day was already booked, but only in the morning then I gave it the class "half-selected". Now because I need to calculate with these dates I need the full dates and not only the day number. Only the ones with the "half-selected" and the "date-range-selected" need to be added to an array.

I tried to push variables to that array and it seemed to work, but when I try to use the array after the for loop, it seems like all array content is changed to the date after the last selected date, what am I doing wrong?

//ex.selected dates are: 9-16 august
var halfke= document.getElementsByClassName("half-selected"); 
var rest = document.getElementsByClassName("date-range-selected");
var dagen = [];
if(typeof halfke[0] != 'undefined')
{
    dagen.push(halfke[0].getElementsByClassName("ui-state-default")[0].innerHTML.trim());
}
for (index = 0; index < rest.length; ++index) 
{
    dagen.push(rest[index].getElementsByClassName("ui-state-default")[0].innerHTML.trim());
}

var myDate = new Date(cur);
var dw = myDate.getDay();
myDate.setDate(myDate.getDate() - (dw+1));
var myDate2 = new Date(cur);
myDate2.setDate(myDate2.getDate() + (6-dw));
//alert(dagen[0]);
var juiste_dagen = new Array();
for (var d = myDate; d <= myDate2; d.setDate(d.getDate() + 1)) {
   //alert(dagen[0]+ " - " + String(d.getDate()))
   if(dagen.indexOf(String(d.getDate()))>-1)
   {
     //alert(d);
    juiste_dagen.push(d);
    alert(juiste_dagen[0]);//here it alerts 9 august (as it should)
    }
}
alert("done");
alert(juiste_dagen[0]);//here it alerts 17 august(which it should not do)
alert(juiste_dagen[1]);//here it alerts 17 august(which it should not do)
alert(juiste_dagen[2]);//here it alerts 17 august(which it should not do)

It's probably something small and stupid but I can't seem to find it. Any help is appreciated!

Huy Vo
  • 2,418
  • 6
  • 22
  • 43
  • Please try to narrow the code you have posted down to the very minimum required to reproduce the problem. This is always useful when debugging and might enable you to find the problem for yourself. – Tom Fenech Jul 18 '14 at 14:36

1 Answers1

3

This is a pass-by-reference problem and it's working as intended. Primitives (like numbers and strings) are pass-by-value. Date is an object, and it is passed by reference, which means without copying. Everywhere you pass a Date object is the same date. Look at the following code, tested just now in my Chrome console:

var myDate = new Date();
undefined
var juiste_dagen = [];
undefined
juiste_dagen.push(myDate);
1
juiste_dagen[0];
Fri Jul 18 2014 09:35:02 GMT-0500 (CDT)
myDate.setDate(19);
1405780502241
juiste_dagen[0];
Sat Jul 19 2014 09:35:02 GMT-0500 (CDT)

So the problem is in your last forloop where you do d.setDate(d.getDate() + 1). You're essentially setting all of the dates pushed into your array to this date on every iteration of the loop. Either use a simple number for a loop counter or create a new date each time before changing the day.

Patrick M
  • 10,547
  • 9
  • 68
  • 101
  • More info on pass-by-reference in JS, see [this](http://stackoverflow.com/questions/518000/is-javascript-a-pass-by-reference-or-pass-by-value-language) and [this](http://stackoverflow.com/questions/13104494/does-javascript-pass-by-reference) question. – Patrick M Jul 18 '14 at 15:14