From Rob ... localStorage

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

console.clear();

var members = [];

function Member(memberFirstName, memberLastName) {
	this.memberFirstName = memberFirstName;
	this.memberLastName = memberLastName;
}

var memberInfoForm = document.getElementById('memberInfoForm');
memberInfoForm.onsubmit = function() {
	var memberFirstName = document.getElementById('firstName').value;
	var memberLastName = document.getElementById('lastName').value;

    //create new member object then store it in array
    members.push(new Member(memberFirstName, memberLastName));
 
    console.clear();
    console.log(members);
    
    return false;
}