Get text from object HTMLInputElement

Question

The DateFunction sets today's date in the text input with id datelate . The date is then stored in the date variable in the addLate function as an object HTMLInputElement . Everytime I try to extract the date stored in the variable, it says: [object HTMLInputElement] instead of the actual date. How do I get only the actual date from the input?

Javascript:

window.onload = function DateFunction() {
    today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth()+1; //January is 0!
    var yyyy = today.getFullYear();

    if(dd<10) {
        dd='0'+dd
    } 

    if(mm<10) {
        mm='0'+mm
    } 

    today = yyyy+'-'+mm+'-'+dd;
    document.getElementById('datelate').value= today;
}

$(document).ready(function(){

    $("#addLate").click(function(){

          var fname=$("#firstname").val();
          var lname=$("#lastname").val();
          var date=$("#datelate").val();
          var time=$("#time").val();
          var detdate=$("#detentiondate").val();
          var reason=$("#reason").val();
        if (fname !== "" && lname !== "" && date !== "" && time !== "" && reason !== "") {
              $.ajax({
                  type:"post",
                  url:"late.php",
                  data:"firstname="+fname+"&lastname="+lname+"&date="+datelate+"&time="+time+"&detentiondate="+detdate+"&reason="+reason,
                  success:function(){
                     alert("Late note added");
                     window.location.href = "home.php";
                  }
              });
        } else {
                alert("You must fill out all the empty information!");
            }
    });

});

HTML:

<input type="text" id="datelate" readonly>

Answer 1

You append a variable:

"&date="+datelate+ 

that shares its name with the id of the element (so reflects the result of its toString() ) as opposed to the correct variable you create here:

var date=$("#datelate").val();

Append "&date="+date+ .

Answer 2

Looks to me like you didn't name the variable properly in your data set.

var date=$("#datelate").val();

data:"firstname="+fname+"&lastname="+lname+"&date="+datelate+"&time="+time+"&detentiondate="+detdate+"&reason="+reason

should be

data:"firstname="+fname+"&lastname="+lname+"&date="+date+"&time="+time+"&detentiondate="+detdate+"&reason="+reason

Notice the difference in the variable date and datelate