JSON Local Storage broke

by Lucille Kenney

HTML

<!-- member.html -->
<section>
    <form action="#" method="post" id="memberInfoForm">
        <fieldset>
            <legend>Add a Member</legend>
            <div>
                <label for="firstName">First Name</label>
                <input type="text" name="firstName" id="firstName" required>
            </div>
            <div>
                <label for="lastName">Last Name</label>
                <input type="text" name="lastName" id="lastName" required>
            </div>
            <div>
                <label for="email">Email</label>
                <input type="text" name="email" id="email">
            </div>
            <div>
                <label for="phone">Phone</label>
                <input type="text" name="phone" id="phone">
            </div>
            <div>
                <label for="month">Month</label>
                <select name="month" id="month">
                    <option value="March">March</option>
                    <option value="April">April</option>
                    <option value="May">May</option>
                    <option value="June">June</option>
                </select>
            </div>
            <div>
                <label for="task">Task</label>
                <input type="text" name="task" id="task">
            </div>
            <!-- <input type="submit" value="Submit" id="submit">-->
        </fieldset>
        <fieldset class="formButtons">
            <input type="reset" id="btnReset" value="Clear" />
            <input type="submit" id="btnSubmit" value="Add Member" />
            <br />
            <input type="button" id="btnDisplayMembers" value="Display Members" />
        </fieldset>
        <div id="output"></div>
    </form>
</section>
<section id="messageSection"><span id="messageSpan">&nbsp;</span>

</section>
<section id="membersTableContainer">
    <!-- use a table here since we're displaying tabular data -->
    <table id="membersTable">
        <caption>
            ...

JavaScript

// Array to hold Member Objects
var members = [];

function Member(memberFirstName, memberLastName, memberEmail, memberPhone, memberMonth, memberTask) {
	this.memberFirstName = memberFirstName;
	this.memberLastName = memberLastName;
	this.memberEmail = memberEmail;
	this.memberPhone = memberPhone;
	this.memberMonth = memberMonth;
	this.memberTask = memberTask;
    
    // don't submit form
    return false;
}



//create new member object then store it in array
members.push(new Member(firstName.value, lastName.value, email.value, phone.value, month.value, task.value));

console.log(members);

//members.push(new Member("John", "Harvard", "john@harvard", "617", "March", "bring fruit"));
//members.push(new Member("Lucille", "Kenney", "[email protected]", "617", "April", "bring fruit"));


var memberInfoForm = document.getElementById('memberInfoForm');
memberInfoForm.onsubmit = function() {
    // your code here
	// Add members to the Array
	var memberFirstName = document.getElementById('firstName').value;
	var memberFirstName = document.getElementById('lastName').value;
	var memberEmail = document.getElementById('email').value;
	var memberPhone = document.getElementById('phone').value;
	var memberMonth = document.getElementById('month').value;
	var memberTask = document.getElementById('task').value;

}

/*onclick.getElementById('btnSubmit').value;
    // get html elements and bind functions to event handlers
    var memberInfoForm = document.getElementById('memberInfoForm');
    memberInfoForm.onsubmit = members;*/


// Print the members to the console
console.log('There are ' + members.length + ' members in the Members Array:');
console.log(members);
console.log(' ');

// Stringify the Objects in the members Array
var jsonMember = JSON.stringify(members);
console.log('JSON.stringify(members) are:');
console.log(jsonMember);
console.log(' ');

// Store the String in Local Storage
window.localStorage.setItem("members", jsonMember);

// Clean out the existing members...