0

I need a dynamic date for my webpage. I want it to show different dates, since im working with ticket sales and the prices varies on which day you buy it.

1st Ticket (Current day - 31. Januar 2017)

2nd Ticket (Current day+2 - Current day +6)

3rd Ticket (Current day+7 - 31. Januar 2017)

This is how I want it to look. Lets say today it's 1st of december 2016.

1st Ticket (1. Dec - 31. Jan 2017)

2nd Ticket (3. Dec - 7. Dec 2016)

3rd Ticket (8. Dec - 31. Jan 2017)

I have worked on something, but I don't know, if this is the right way to do it. Perhaps there is a easier way? And also I can't seem to remove the year on the first date.

var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul',
'Aug','Sep','Oct','Nov','Dec'];       
var tomorrow = new Date();
tomorrow.setTime(tomorrow.getTime() + (3600*24));       
document.getElementById("spanDate").innerHTML = tomorrow.getDate() + " " + months[tomorrow.getMonth()] + " " + tomorrow.getFullYear();
var tomorrow = new Date();
tomorrow.setTime(tomorrow.getTime() + (2000*3600*24));       
document.getElementById("spanDate2").innerHTML = tomorrow.getDate() + " " + months[tomorrow.getMonth()] + " " + tomorrow.getFullYear();
var tomorrow = new Date();
tomorrow.setTime(tomorrow.getTime() + (6000*3600*24));       
document.getElementById("spanDate3").innerHTML = tomorrow.getDate() + " " + months[tomorrow.getMonth()] + " " + tomorrow.getFullYear();
var tomorrow = new Date();
tomorrow.setTime(tomorrow.getTime() + (7000*3600*24));       
document.getElementById("spanDate4").innerHTML = tomorrow.getDate() + " " + months[tomorrow.getMonth()] + " " + tomorrow.getFullYear();
#day1, #day2, #day3{
  background-color:lightgrey;
  padding:10px;
  width:300px;
  height:auto;
  margin-bottom:2px;

}

.text{
  background-color:lightblue;
  margin-right:20px;
  padding:10px;
}
<div id="day1"><span class="text">1. Ticket </span><span id="spanDate"></span> - 31. Dec 2017</div>
<div id="day2"><span class="text">2. Ticket </span><span id="spanDate2"></span> - <span id="spanDate3"></span></div>
<div id="day3"><span class="text">3. Ticket </span><span id="spanDate4"></span> - 31. Dec 2017</div>

3
  • You have working code, if you're trying to improve it you might be better at Code Review
    – Jamiec
    Commented Nov 18, 2016 at 9:49
  • Check out moment.js as a way to make the date manipulation much cleaner.
    – Paul
    Commented Nov 18, 2016 at 9:54
  • I'll take I look @Paul
    – Bel
    Commented Nov 18, 2016 at 10:13

0

Browse other questions tagged or ask your own question.