Index File: <!DOCTYPE html> <html lang=\"en\"> <head> <title>Practice Assignment
ID: 3834761 • Letter: I
Question
Index File:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Practice Assignment</title>
</head>
<script src="js/myScript.js"></script>
<body>
<div id="welcomeMessage">Hi</div>
<form id="frm1">
<label id="fname_prompt">Please enter your first name: </label><input type="text" name="firstname" id="FName">
</form>
<button id="sub_btn">Submit</button>
</body>
</html>
JavaScript File:
function displayWelcome()
{
document.getElementById("welcomeMessage").innerHTML = "Welcome to the Module 5 Practice Assignment";
}
function validateInput()
{
var firstNameValue = document.getElementById("FName").value;
var d = new Date();
var currentTime = d.getUTCHours() + ":" + d.getUTCMinutes() + " UTC.";
if(firstNameValue=="" || firstNameValue==null ) {
alert("First name is a required field");
}
else {
alert("Hi " + firstNameValue + ". The time is " + currentTime);
}
}
Question:
Add a comment before each line of the function, describing what action the next line of code performs.
Explanation / Answer
/*
function for welcome
*/
function displayWelcome()
{
document.getElementById("welcomeMessage").innerHTML = "Welcome to the Module 5 Practice Assignment";
}
/*
function for validating input
*/
function validateInput()
{
// taking firstName that is entered into text box
var firstNameValue = document.getElementById("FName").value;
// create date object
var d = new Date();
// getting current time function from Date Object
var currentTime = d.getUTCHours() + ":" + d.getUTCMinutes() + " UTC.";
// check whether firstName is null or not
// if then alert FirstName is required
// else
// alert firstname and currentTime
if(firstNameValue=="" || firstNameValue==null ) {
alert("First name is a required field");
}
else {
alert("Hi " + firstNameValue + ". The time is " + currentTime);
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<title>Practice Assignment</title>
</head>
<!-- this file contains the external javascript myscript.js-->
<script src="js/myScript.js"></script>
<body>
<div id="welcomeMessage">Hi</div>
<!--- defining form element and providing id frm1 that will be useful later to reference form --->
<form id="frm1">
<!-- -->
<!-- enter firstname that will be stored and refered by FName -->
<label id="fname_prompt">Please enter your first name: </label><input type="text" name="firstname" id="FName">
</form>
<!-- define button that will have one onClick event when the button will be called the javascript function validateInput() will be called-->
<button id="sub_btn">Submit</button>
</body>
</html>