Question

essentially what I cannot figure out is how to take a Date property of an object (birthday – retrieved from a Date type input in the HTML) and use it to add a “days until next birthday” property to the object, for example:

var surnameField,firstNameField,birthdayField, phoneField, addressField, postField, emailField, groupField ;  //Declaring variables for the fields

var Contact = function(surname,firstName,date, phone , address , post, email, group){
    this.surname = surname ;
    this.firstName = firstName ;
    this.birthdayDate = new Date (date) ;
    this.phone = phone;
    this.address= address;
    this.email = email;
    this.post = post;
    this.group = group;

}



var contacts = [];

var getday = function() {

    for (var i= 0, j=contacts.length;i<j;i++){
       var a = contacts[i].birthdayDate.getDate();
        contacts[i].days = a;

    }
}





Contact.prototype.tableRow = function(){
    var tr = "<tr><td>" + this.surname + "</td><td>" + this.firstName + "</td><td>" + this.birthdayDate + "</td><td>" + this.phone + "</td><td>" + this.email +
            "</td><td>" + this.address + "</td><td>" + this.post + "</td><td>" + this.group + "</td></tr>";
    return tr;
}

var addContact = function(surnameField,firstNameField,birthdayField, phoneField, addressField, postField, emailField, groupField ){
        if(surnameField.value){
            a = new Contact(surnameField.value, firstNameField.value,birthdayField.value, phoneField.value, addressField.value, postField.value, emailField.value, groupField.value);
            contacts.push(a);
        }else{ alert("Please complete all fields")}

}

var clearUI = function(){
    var white = "#fff";
    surnameField.value = "";
    surnameField.style.backgroundColor = white;
    firstNameField.value = "";
    firstNameField.style.backgroundColor = white;
    birthdayField.value="";
    birthdayField.style.backgroundColor = white;
    phoneField.value = "";
    phoneField.style.backgroundcolor = white;
    addressField.value = "";
    addressField.style.backgroundcolor = white;
    postField.value = "";
    postField.style.backgroundcolor = white;
    emailField.value = "";
    emailField.style.backgroundcolor = white;
    groupField.value="";
    groupField.style.backgroundcolor = white;
}


var updateList = function(){
    var tableDiv = document.getElementById("table"),
        table = "<table border='2'><thead><th>  Surname  </th><th> First Name</th><th>Date of Birth</th><th>  Phone Number  </th><th>  Email Address </th><th>  Address  </th><th> Postcode  </th><th>Group</th></thead>";

    for (var i= 0, j=contacts.length;i<j;i++){
        var cntct = contacts[i];
        table += cntct.tableRow();
    }
    table +="</table>";
    tableDiv.innerHTML = table;
    //getday();
    saveContacts();

}

var add = function(){
    addContact(surnameField,firstNameField,birthdayField, phoneField, addressField, postField, emailField, groupField);
    clearUI();
    updateList();
};

var saveContacts = function(){
    var cntcts = JSON.stringify(contacts);
    if (cntcts !==""){
        localStorage.contacts = cntcts;
    }else{
        alert("Could not save contacts");
    }
}

var loadContacts = function(){
    var cntcts = "";
    if(localStorage.contacts !== undefined){
        cntcts = localStorage.contacts;
        contacts = JSON.parse(cntcts);
        var proto = new Contact();
        for (var i=0; i<contacts.length; i++){
            var cntct = contacts[i]
            cntct.__proto__ = proto;
        }
    }
}

var clearContacts = function(){
    contacts = [];
    updateList()

}

/*contacts.prototype.isDue = function(){
    var now = new Date();
    if(this.birthday > now){
        return false;
    } else {
        return true;
    }
};*/



window.onload = function(){
    loadContacts();
    updateList();
    surnameField = document.getElementById("surname");
    firstNameField = document.getElementById("firstName")
    birthdayField = document.getElementById("birthday");
    phoneField = document.getElementById("phone");
    addressField = document.getElementById("address");
    postField = document.getElementById("post");
    emailField = document.getElementById("email");
    groupField = document.getElementById("group");
    addButton = document.getElementById("addButton");
    addButton.onclick = add;
    delButton = document.getElementById("delButton");
    delButton.onclick = clearContacts;
    clearUI();
}

What I was attempting to do was to get the Days/Months value from the date object and use it to calculate the days until the next birthday, however everything I have tried seems to not work. getDay() and getMonth() worked in the console, but when implemented I got a “getDay is not at a deinfed method of .birthday” type of error.

So ideally once fixed each object in the array should have a “daysTilBirthday” property.

Any help would be greatly appreciated.

SOLVED

I forgot to add a check to ensure that when the data was reloaded, it was reloaded as a Date, not as a string, e.g.

cntct.birthdayDate = new Date(cntct.birthdayDate);

Thanks for your help anyway!

Answer 1

Try birthday.getDate()

here is the fiddle : http://jsfiddle.net/ZJ6CN/