Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Oct 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Adding days to today’s date

    I have a script I pieced together from this forum and have hit a wall so to speak—I was hoping I could get some input. I wish to have a dropdown menu containing date options (15 days, 30 days, 45 days, 60 days…) When a selection is made, a text field appears next to your selection containing the difference in your selection vs the current date. So for example. If today was January 1st, and you selected 30 days, the box would show Jan 31st. I’ve managed to make this work for only the first date selection option, any other date selection shows the result for the first option only. Ultimately what I would like it to list the corresponding date given the 15/30/45/60 day selection.Hoping I could get some assistance. Thank you very much!

    Code:
    <BODY onload="init()">
    <script language="JavaScript"><!--
    function addDays(myDate,days) {
    return new Date(myDate.getTime() + days*24*60*60*1000);
    }
    //--></script>
    
    <form name="frm" id="frm">
    <select id="dropdown">
    <option value="None">Select a Date</option>
    <option value="text1">15 Days from Now</option>
    <option value="text2">30 Days from Now</option>
    <option value="text3">45 Days from Now</option>
    <option value="text3">60 Days from Now</option>
    
    </select>
    <input type="text" id="mytext" size=60>
    </form>
    </BODY>
    </HTML>
    
    <script type="text/javascript">
    var mytextbox = document.getElementById('mytext');
    var mydropdown = document.getElementById('dropdown');
    
    mydropdown.onchange = function(){
    mytextbox.value= addDays(new Date(),+15);
    }
    </script>

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,189
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    Working too hard.
    Code:
    <!DOCTYPE html>
    <html>
    <body>
    <form id="frm">
    <select name="dropdown">
    <option value="0">Select a Date</option>
    <option value="15">15 Days from Now</option>
    <option value="30">30 Days from Now</option>
    <option value="45">45 Days from Now</option>
    <option value="60">60 Days from Now</option>
    </select>
    <input type="text" name="mytext" size=60>
    </form>
    <script type="text/javascript">
    (
      function( )
      {
          var form = document.getElementById("frm");
          var mytextbox = form.mytext;
          var mydropdown = form.dropdown;
          mydropdown.onchange = 
              function( )
              {
                 var theDate = new Date();
                 theDate.setDate( theDate.getDate() + Number(this.value) );
                 var pretty = (theDate.getMonth()+1) + "/" + theDate.getDate() + "/" + theDate.getFullYear();
                 mytextbox.value = pretty;
              }
      }
    )( );
    </script>
    </body>
    </html>
    Change the code for pretty to format the date however you want it.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,918
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Another variant:-

    Code:
    <html>
    <head>
    </head>
    <body>
    
    <select id="myselectbox">
    <option value="3">3 days</option>
    <option value="10">10 days</option>
    <option value="20">20 days</option>
    <option value="30">30 days</option>
    </select>
    
    <input type="button" value="Add date" onclick="return addDate('Thursday, 31 December, 2012');" />
    <input type="button" value="Add date" onclick="return addDate(new Date());" />
    <br><br>
    <input type = "text" id = "mytextbox" readonly>
    
    <script type="text/javascript">
    function addDate(addtoDate) {
    var orignaltime = new Date(addtoDate).getTime();
    var dropdowndateinMS = document.getElementById("myselectbox").value * 86400 * 1000;//day x seconds x milliseconds
    var addedtime = orignaltime + dropdowndateinMS ;
    var addedTimeInProperFormat = new Date(addedtime);
    addedTimeInProperFormat = addedTimeInProperFormat.toDateString()
    document.getElementById("mytextbox").value = addedTimeInProperFormat;
    }
    </script>
    
    </body>
    </html>
    <script language=javascript> is long deprecated. Use <script type = "text/javascript"> instead (in fact also deprecated but still necessary for IE<9).
    The <!-- and //--> comment (hiding) tags have not been necessary since IE3 (i.e. since September 1997). If you see these in some published script it is a warning that you are looking at ancient and perhaps unreliable code.


    Quizmaster: In sporting folklore, the word "golf" is often erroneously said to be an acronym of the phrase "gentlemen only, ladies ....." what?
    Contestant: Fornicate.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •