Unit 2B

by Larry Adams

HTML

<label for="fName">First Name:</label>
            <input type="text" id="fName">
    <br>
   
   <label for="mName">Middle Name:</label>
            <input type="text" id="fname">
    <br>
      
        <label for="lName">Last Name:</label>
            <input type="text" id="lName">
    <br>  
      
        <label for="phone">Phone:</label>
           <input type="text" id="phone">
    <br>
      
        
    <label for="email">Email:</label>
            <input type="text" id="email">
    <br>

        <br> <br>
            <input type="button" id="addPerson" value="Add Person" />

CSS

table, th, td {
    border: 1px solid black;
    
}
th,td {
    padding: 15px;
    width: 150px;
}

JavaScript

console.clear();

// Array to hold Person Objects
var people = [];

// Person Object
function Person(fName, lName) {
    this.fName = fName;
    this.lName = lName;
    this.getPerson = function() {
        return this.fName + " " + this.lName;
    }
}


// Checking condition before adding data
function hasData (fName, lName) {
    var haveData = false;
    if(fName.length > 0 && lName.length > 0) {
        haveData = true;
    }
    return haveData;
}
    

// Function to add a Person Object to the Array
// No return
var addPerson = document.getElementById('addPerson');
addPerson.onclick = function() {
    var fName = document.getElementById('fName').value;
    var lName = document.getElementById('lName').value;
    
    if (hasData(fName, lName)) {
            console.log(fName + " " + lName);
    } else {
        console.log('No name entered!');
    }