Is there something wrong with this call to a javascript function in an html form

Question

I have a textbox which takes a date as input. I have added the checkboxes todaysDate4SD and todaysDate4ED so that when a user wants one of these text boxes to be today's date they can click the corresponding check box in order for it to be populated for them (they do not need ot fill in the textbox with today's date). I put ab alert inside the populateTodaysDate() function so I know it is not reaching inside of there. I'm kind of a newbie when it comes to JS so I'm not sure what syntax is wrong that it is not calling this function.

<div id="form">
  <form>
    <p class="field">Start Date:<input type="text" id="start" name="start" /></p>   
    <p class="field"><input type="checkbox" id="todaysDate4SD" name="todaysDate4SD"
                            onclick="populateTodaysDate(todaysDate4SD,start);" />
    <p class="field">End Date:<input type="type" id="end" name="end" /></p>
    <p class="field"><input type="checkbox" id="todaysDate4ED" name="todaysDate4ED" 
                            onclick="populateTodaysDate(todaysDate4ED,end);" />
    <p class="field"><input type="checkbox" id="includeEndDate" name="includeEndDate" checked="true" />
    Include the end date in the calculation</p>
    <p class="submitbttn"><input type="button" value="Submit" onclick="calculate();" /></p>
  </form>

The parameters inside the onclick populateTodaysDate call (i.e. todaysDate4ED,end) are strings. I was attempting to pass in the id's so that in the function I could use document.getElementById(id) ... I tried passind in the actual element before (by putting this document.getElem... inside the onclick call but that didn't work either).

Below follows the function that I believe is not being called for some reason. It is in a script tag in the head of the html page.

    function populateTodaysDate(checkbox, dateBox) {
        alert("I'm here!")
        if(checkBox.checked) {
            dateBox.value =  dateToString(new Date()).
        } else {
            dateBox.value = "";
        }
    }

The alert is not important and was just added to see if I was actually entering this function...

... In case anyone wants to see dateToString...shouldn't be necessary (99.98% sure that is not where the problem is)

    function dateToString(d1) {
        var curr_year = d1.getFullYear();

        var curr_month = d1.getMonth() + 1; //Months are zero based
        if (curr_month < 10) {
            curr_month = "0" + curr_month;
        }

        var curr_date = d1.getDate();
        if (curr_date < 10) {
            curr_date = "0" + curr_date;
        }
        return curr_month + "/" + curr_date + "/" + curr_year;
    }

@yvytty that is the name of the function that I want it to be calling but it is not. The alert would have allowed me to know it was entering. I will add my js code in a second — nbonbon
– nbonbon, Commented May 25, 2013 at 16:12
dateToString is a simple helper method I created that simply returns the string format of the current date that I want. — nbonbon
– nbonbon, Commented May 25, 2013 at 16:22
He meant that you have a trailing . after the dateToString() call — Jared Eitnier
– Jared Eitnier, Commented May 25, 2013 at 16:25

claustrofob · Accepted Answer · 2013-05-25 16:22:22Z

3

Your checkboxes should look like this:

<input type="checkbox" id="todaysDate4SD" name="todaysDate4SD"
                        onclick="populateTodaysDate(this,'start');" />

<input type="checkbox" id="todaysDate4ED" name="todaysDate4ED" 
                        onclick="populateTodaysDate(this,'end');" />

and update your function:

function populateTodaysDate(checkbox, dateBox) {
    dateBox = document.getElementById(dateBox);
    if(checkBox.checked) {
        dateBox.value =  (new Date()).toString("yyyy-MM-dd HH:mm:ss");
    } else {
        dateBox.value = "";
    }
}

answered May 25, 2013 at 16:22

claustrofob

5,0042 gold badges21 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Matthew Over a year ago

Exactly my answer, just a bit quicker. +1

BeNdErR Over a year ago

here's a fiddle for this soulution: jsfiddle.net/TK5EG @claustrofob little fix: change checkbox to checkBox in the function parameters, otherwise will throw a "checkBox undefined" error

nbonbon Over a year ago

I understand your solution...similar to what I tried before but I had double quotes around end. Does it need to be single if double quotes surround the attribute value? ... just looking for the reasoning.

claustrofob Over a year ago

No matter what type of quotes you use

claustrofob Over a year ago

i guess he means name="end" and name='end'

|

Collectives™ on Stack Overflow

Is there something wrong with this call to a javascript function in an html form

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related