www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 17

Thread: Date Inserted when Checkbox is Checked.

  1. #1
    Join Date
    Jan 2006
    Posts
    301

    Date Inserted when Checkbox is Checked.

    I've got a script that gives me 2 dates in input boxes. 1 is for the current date and the other is for a date of six months in the future. I would like this future date to only populate in the text box if a checkbox is checked. One catch, the future box may already have a date in there so when checked it would have to override this value with the new 6 month date. Here is what I have thanks for the help:

    <html>
    <HEAD>
    <script type="text/javascript">
    Date.prototype.addMonths = function (m) {
    var d = new Date (this.getTime())
    d.setMonth (d.getMonth() + m)
    return d
    }

    onload = function () {
    document.ThisForm.OtherDate.value = formatDate(new Date());
    document.ThisForm.Expiration_Date.value = formatDate(new Date().addMonths(6));
    }

    function formatDate(d) {
    var theyear=d.getYear()
    if (theyear < 1000) theyear+=1900

    var theday=d.getDay()
    var themonth=d.getMonth()+1
    if (themonth<10) themonth="0"+themonth

    var theday = d.getDate()
    if (theday<10) theday="0"+theday

    var displayfirst=themonth
    var displaysecond=theday
    var displaythird=theyear

    return displayfirst+"/"+displaysecond+"/"+displaythird
    }
    </script>

    </HEAD>

    <body>
    <form action="" name="ThisForm" method="post">
    Today's Date: <input class=plaintext6 type="text" name="OtherDate" size="10"><br>
    Expiration Date: <input class=plaintext6 type="text" name="Expiration_Date" size="10">
    <input type=checkbox name="Show" value="Checked" > <i>(check for 6 months later)</i><br>
    </form>

    </body>
    </html>
    www.unitingbands.com - Where Talents Unite!

  2. #2
    Join Date
    Oct 2006
    Posts
    1,297
    An idea:
    Code:
    onclick="if(this.checked){
     Expiration_Date.value = formatDate(new Date(OtherDate.value).addMonths(6));
     return this.checked = false;} return true;"

  3. #3
    Join Date
    Jan 2006
    Posts
    301
    how would I code the actual checkbox input tag?

    <input type=checkbox name="Show" value="Checked" onclick="(this.checked)">
    www.unitingbands.com - Where Talents Unite!

  4. #4
    Join Date
    Oct 2006
    Posts
    1,297
    Just insert everything I posted in place of the onclick (and its assignment) you just posted.

  5. #5
    Join Date
    Jan 2006
    Posts
    301
    sorry that didn't work. Both boxes are now blank and when I check the box I get a javascript error.
    www.unitingbands.com - Where Talents Unite!

  6. #6
    Join Date
    Oct 2006
    Posts
    1,297
    True, the code I posted presumed that the first date would be filled in already.
    That code calculates a six-month offset from the date in the first box.

  7. #7
    Join Date
    Jan 2006
    Posts
    301
    Ok, I did get it to work however the box doesn not actually check is it possible to have the box actually check when you click on it.

    Thank for the help here is what I've got:

    <html>
    <HEAD>
    <script type="text/javascript">
    Date.prototype.addMonths = function (m) {
    var d = new Date (this.getTime())
    d.setMonth (d.getMonth() + m)
    return d
    }

    onload = function () {
    document.ThisForm.OtherDate.value = formatDate(new Date());
    document.ThisForm.Expiration_Date.value = formatDate(new Date().addMonths(6));
    }



    function formatDate(d) {
    var theyear=d.getYear()
    if (theyear < 1000) theyear+=1900

    var theday=d.getDay()
    var themonth=d.getMonth()+1
    if (themonth<10) themonth="0"+themonth

    var theday = d.getDate()
    if (theday<10) theday="0"+theday

    var displayfirst=themonth
    var displaysecond=theday
    var displaythird=theyear

    return displayfirst+"/"+displaysecond+"/"+displaythird
    }
    </script>

    </HEAD>

    <body>

    <form action="" name="ThisForm" method="post">
    Today's Date: <input class=plaintext6 type="text" name="OtherDate" size="10"><br>
    Expiration Date: <input class=plaintext6 type="text" name="Expiration_Date" size="10">

    <input type=checkbox name="Show" value="Checked" onclick="if(this.checked){
    Expiration_Date.value = formatDate(new Date(OtherDate.value).addMonths(6));
    return this.checked = false;} return true;"> <i>(check for 6 months later)</i><br>
    </form>

    </body>
    </html>
    www.unitingbands.com - Where Talents Unite!

  8. #8
    Join Date
    Oct 2006
    Posts
    1,297
    Yep, I did it that way so that it is easier to calculate and re-calculate a six-month offset repeatedly.
    The following is changed to go back to the normal function:
    Code:
    onclick="if(this.checked){
     Expiration_Date.value = formatDate(new Date(OtherDate.value).addMonths(6));
     } return true;"

  9. #9
    Join Date
    Jan 2006
    Posts
    301
    Excellent, Thanks it is perfect!
    www.unitingbands.com - Where Talents Unite!

  10. #10
    Join Date
    Oct 2006
    Posts
    1,297
    Salud!

  11. #11
    Join Date
    Jan 2006
    Posts
    301
    I do have one other question...

    I'm going to use this on the same page as another javascript that uses a body onload:

    <body onload="initial_update();">


    How can I use these 2 onloads together in the body tag? Your script has

    onload = function () {
    document.formc.DATE.value = formatDate(new Date());

    }

    Thanks!
    www.unitingbands.com - Where Talents Unite!

  12. #12
    Join Date
    Oct 2006
    Posts
    1,297
    What I posted uses onclick -- not onload. There's no conflict there.

  13. #13
    Join Date
    Jan 2006
    Posts
    301
    Sorry I was referring to the

    onload = function () {

    of the date script.
    www.unitingbands.com - Where Talents Unite!

  14. #14
    Join Date
    Oct 2006
    Posts
    1,297
    OK, drop this:

    <body onload="initial_update();">

    for this:

    <body>


    and code it this way:
    Code:
    onload = function () {
    initial_update();
    document.formc.DATE.value = formatDate(new Date());
    }

  15. #15
    Join Date
    Jan 2006
    Posts
    301
    I have to have this:
    <body onload="initial_update();">

    for my other script so I will have to add the date onload function to the body tag and not the actual script and I'm not sure how to do that. Any suggestions.
    www.unitingbands.com - Where Talents Unite!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles