the next date to be selected in the select list with javascript

Question

<html>

    <head>
        <script>
            function data() {
                var today = new Date();

                var month = new Array();
                month[0] = "January";
                month[1] = "February";
                month[2] = "March";
                month[3] = "April";
                month[4] = "May";
                month[5] = "June";
                month[6] = "July";
                month[7] = "August";
                month[8] = "September";
                month[9] = "October";
                month[10] = "November";
                month[11] = "December";


                var d = today.getDate();
                var m = month[today.getMonth()];
                var y = today.getFullYear();


            }
        </script>
    </head>

    <body onload="data();">
        <select id="day">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
            <option value="9">9</option>
            <option value="10">10</option>
            <option value="11">11</option>
            <option value="12">12</option>
            <option value="13">13</option>
            <option value="14">14</option>
            <option value="15">15</option>
            <option value="16">16</option>
            <option value="17">17</option>
            <option value="18">18</option>
            <option value="19">19</option>
            <option value="20">20</option>
        </select>
        <select id="month">
            <option value="Jan">Jan</option>
            <option value="Feb">Feb</option>
            <option value="Mar">Mar</option>
            <option value="Apr">Apr</option>
            <option value="May">May</option>
            <option value="Jun">Jun</option>
            <option value="Jul">Jul</option>
            <option value="Aug">Aug</option>
            <option value="Sep">Sep</option>
            <option value="Oct">Oct</option>
            <option value="Nov">Nov</option>
            <option value="Dec">Dec</option>
        </select>
        <select id="year">
            <option value="2014">2014</option>
            <option value="2015">2015</option>
        </select>
    </body>

</html>

I want the date to be selected as 14 aug 2014 Please help with the javascipt part , the data should remain static (select lists will remain static) only javascript will be modified. i m facing difficulty making the next date selected from the drop down available.

possible duplicate of [How to change html selected option using JavaScript?](http://stackoverflow.com/questions/10911526/how-to-change-html-selected-option-using-javascript) — Andrew, Aug 13 '14 at 18:37

rink.attendant.6 · Accepted Answer · 2014-08-13T19:02:55.653

1

In your <script> tag:

function data() {
    'use strict';

    // Get today's date
    var today = new Date();

    // Create an array of month names for the month fields
    var monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

    // Increase date by 1 day
    today = new Date(today.valueOf() + 86400000);

    // Set the values
    document.getElementById('day').value = today.getUTCDate();
    document.getElementById('month').value = monthNames[today.getUTCMonth()];
    document.getElementById('year').value = today.getUTCFullYear();
}

// Automatically do this on load
window.addEventListener('load', data, false);

And remove the onload attribute from the body tag.

See jsFiddle.

edited Aug 13 '14 at 19:02

answered Aug 13 '14 at 18:46

rink.attendant.6

44,500
61
101
156

why cant we use onload in body? – user2094357 Aug 13 '14 at 18:59
If you look at the code you will see that I increase the date by 1 day. – rink.attendant.6 Aug 13 '14 at 18:59
but it is actually doesn't increase when executed the code – user2094357 Aug 13 '14 at 19:01
Today is August 13 and when the page is loaded, it shows 14 Aug 2014 selected. See the jsFiddle I added. – rink.attendant.6 Aug 13 '14 at 19:03
its 14 august becoz its 12 am when i changed system date to 6 august it remained not 6 n not 7 – user2094357 Aug 13 '14 at 19:05
i mean it remained 6 and not 7 – user2094357 Aug 13 '14 at 19:06
remove today.getUTCDate(); n only use today.getDate(); for month and year too then it works perfectly....thanks – user2094357 Aug 13 '14 at 19:26
just want to add a little more conditions like if the user has selected past months like jan feb since we are into august and past dates like 1 to 13 or if 2014 year is over throw an error as select validate date....how can ido this? – user2094357 Aug 13 '14 at 19:31

Andranik · Answer 2 · 2014-08-13T19:37:49.337

Add this to your JavaScript

  function getNextDate(currentMonth){
     switch(currentMonth) {
         case "January":
         case "March":
         case "May":
         case "July":
         case "August":
         case "October": if(d==31) {
                 d=1;
                 m=month[today.getMonth()+1];
               } else {
                 d++;
               }
             break;
         case "December": if(d==31) {
                 d=1;
                 m=month[today.getMonth()+1];
                 y++;
             } else {
                 d++;
             }
             break;
         case "February": if(d==28) {
                 d=1;
                 m=month[today.getMonth()+1];
              } else {
                 d++;
              }
             break;
         default: if(d==30) {
                 d=1;
                 m=month[today.getMonth()+1];
              } else {
                 d++;
              }
             break;
     }
 };
            getNextDate(m);
            document.getElementById('day').value = d;
            document.getElementById('month').value = m.slice(0,3);
            document.getElementById('year').value = y;

FIDDLE: http://jsfiddle.net/1cg1n0q2/

how to handle 31 aug then next date should be first september — user2094357, Aug 13 '14 at 19:00
just want to add a little more conditions like if the user has selected past months like jan feb since we are into august and past dates like 1 to 13 or if 2014 year is over throw an error as select validate date....how can ido this? — user2094357, Aug 13 '14 at 19:31

the next date to be selected in the select list with javascript

2 Answers2