///////////////Help with HTML5/Java//////////////////////////////////////// I ha

ID: 3813021 • Letter: #

Question

///////////////Help with HTML5/Java////////////////////////////////////////

I have an HTML code Im working with. On the JavaScript part, it would not run and I think I have some errors there.

The variables should stay like that but I do not know why it is not processing the form.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../images/week2-2favicon.ico">

<title>Jumbotron Template for Bootstrap</title>

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

<link href="../../assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">

<link href="../css/homework.css" rel="stylesheet">

<script src="../../assets/js/ie-emulation-modes-warning.js"></script>

</head>

<body>

<nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="../pages/week3-1.html">Week3-1</a>
                <a class="navbar-brand" href="../pages/week3-2.html">Week3-2</a>
                <a class="navbar-brand" href="../pages/week3-3.html">Week3-3</a>
            </div>
            <div id="navbar" class="navbar-collapse collapse">
                <form class="navbar-form navbar-right">
                    <div class="form-group">
                        <input type="text" placeholder="Email" class="form-control">
                    </div>
                    <div class="form-group">
                        <input type="password" placeholder="Password" class="form-control">
                    </div>
                    <button type="submit" class="btn btn-success">Sign in</button>
                </form>
            </div>
        </div>
    </nav>

<div class="jumbotron">
        <div class="container">
            <h1>Hello, class!</h1>
            <article>
                <p>
                    words
                </p>
            </article>
            <p><a class="btn btn-primary btn-lg" href="https://www.csee.umbc.edu/~squire/blueball.htm" role="button">Learn more »</a></p>
        </div>
    </div>

<div class="container">
        
        <div class="row">
            
            <h2>Sign Up Here!</h2>
            <p>Fill out the form with correct information below please.</p>
            <form id="myRegForm">
                <fieldset>
                    <legend>Contact Information:</legend>
                    <label id="lblFirstName" class="myLabels">First name</label> <input type="text" id="txtFirstName" required /> <br />
                    <label id="lblLastName" class="myLabels">Last name</label> <input type="text" id="txtLastName" required /> <br />
                    <label id="lblStreet" class="myLabels">Street Address</label> <input type="text" id="txtStreet" /> <br />
                    <label id="lblCity" class="myLabels">City</label> <input type="text" id="txtCity" /> <br />
                    <label id="lblPostalCode" class="myLabels">Zip Code</label> <input type="number" min="0" max="99999" id="txtPostalCode" /> <br />
                    <label id="lblState" class="myLabels">State</label> <input type="text" id="txtState" /> <br />
                    <label id="lblCountry" class="myLabels">Country</label> <input type="text" id="txtCountry" /> <br />
                    <label id="lblPhone" class="myLabels">Phone Number</label> <input type="tel" id="txtPhone" /> <br />
                    <label id="lblEmail" class="myLabels">Email</label> <input type="email" id="txtEmail" pattern="[@college.edu]" /> <br />
                    <label id="lblPassword" class="myLabels">Password</label> <input type="password" id="txtPassword" /> <br />

</fieldset>
<br />

                <fieldset>
                    <legend>Preferences:</legend>
                    <label id="lblFavColor" class="myLabels">Favorite Color</label> <input type="color" id="txtFavColor" /> <br />
                    <label id="lblDOB" class="myLabels">Date of Birth</label> <input type="date" id="txtDOB" /> <br />
                    <label id="lblNumRummageSales" class="myLabels">Number of Rummage Sales Attended</label> <input type="number" id="txtNumber" /> <br />
                    <input type="hidden" id="txtMySecret" value="Super Secret" />

                    <label id="lblSellonEbay" class="myLabels">Do you sell items on EBay? </label>
                    Yes <input type="radio" name="txtSellonEbay" id="rdYes" value="Yes we sell on Ebay." />  
                    No <input type="radio" name="txtSellonEbay" id="rdNo" value="No we do not sell on Ebay" /> <br />

                    <label id="lblPurchaseMethod" class="myLabels">What is your method of payment?</label>
                    <label id="lblPayPal" class="myLabels">PayPal</label><input type="radio" name="txtPurchaseMethod" id="txtPayPal" value="Paypal" />
                    <label id="lblCredit" class="myLabels">Credit Card</label><input type="radio" name="txtPurchaseMethod" id="txtCredit" value="Credit" />
                    <label id="lblCash" class="myLabels">Cash</label><input type="radio" name="txtPurchaseMethod" id="txtCash" value="Cash" />
                    <label id="lblMonopolyMoney" class="myLabels">MONOPOLY MONEY</label><input type="radio" name="txtPurchaseMethod" id="txtMonopoly" value="MonopolyMoney" />
                    <br />

                    <label id="lblFavRummageCategories" class="myLabels">What is your favorite item category?</label>
                    <label id="lblElectronics" class="myLabels">Electronics</label><input type="checkbox" name="txtFavRummageCategories" id="ckElectronics" value="Electronics" />
                    <label id="lblClothes" class="myLabels">Clothes</label><input type="checkbox" name="txtFavRummageCategories" id="ckClothes" value="Clothes" />
                    <label id="lblFood" class="myLabels">Food</label><input type="checkbox" name="txtFavRummageCategories" id="ckFood" value="Food" />
                </fieldset>

<hr>

<footer>
            <p>© 2016 Company, Inc.</p>
        </footer>
    
    
    <script>
        function processMyForm() {
            var FirstName = document.getElementById("txtFirstName").value;
            var LastName = document.getElementById("txtLastName").value;
            var Street = document.getElementById("txtStreet").value;
            var City = document.getElementById("txtCity").value;
            var PostalCode = document.getElementById("txtPostalCode").value;
            var State = document.getElementById("txtState").value;
            var Country = document.getElementById("txtCountry").value;
            var Phone = document.getElementById("txtPhone").value;
            var Email = document.getElementById("txtEmail").value;
            var Password = document.getElementById("txtPassword").value;
            var FavColor = document.getElementById("txtFavColor").value;
            var DOB = document.getElementById("txtDOB").value;
            var NumRummageSales = document.getElementById("txtNumber").value;
            var MySecret = document.getElementById("txtMySecret").value;

            var SellonEbay = "";
            var rdtxtSellonEbayYes = document.getElementById("rdYes").checked;
            var rdtxtSellonEbayNo = document.getElementById("rdNo").checked;

            if (rdtxtSellonEbayYes) {
                SellonEbay = document.getElementById("rdYes").value;
            }
            else if (rdtxtSellonEbayNo) {
                SellonEbay = document.getElementById("rdNo").value;
            }
            else {
                SellonEbay = "You did not answer the question.";
            }
            var PurchaseMethod = "";
            var rdPayPal = document.getElementById("txtPayPal").checked;
            var rdCredit = document.getElementById("txtCredit").checked;
            var rdCash = document.getElementById("txtCash").checked;
            var rdMonopolyMoney = document.getElementById("txtMonopoly").checked;
            if (rdPayPal) {
                PurchaseMethod = document.getElementById("txtPayPal").value;
            }
            else if (rdCredit) {
                PurchaseMethod = document.getElementById("txtCredit").value;
            }
            else if (rdCash) {
                PurchaseMethod = document.getElementById("txtCash").value;
            }
            else if (rdMonopolyMoney) {
                PurchaseMethod = document.getElementById("txtMonopoly").value;
            }

            // OutPut
            var message =
                "Welcome " + FirstName.toString() + " " + LastName.toString() + "<br /><br />" +
                "Street address: " + Street.toString() + ", " + City.toString() +
                State.toString() + ", " + Country.toString() + " " + PostalCode.toString() + "<br />" +
                "Phone Number: " + Phone.toString() + "<br />" +
                "Email: " + Email.toString() + "<br />" +
                "Password: " + Password.toString() + "<br />" +
                "<h3>Preferences</h3>" +
                "Favorite Color: " + FavColor.toString() + "<br />" +
                "Date of Birth: " + DOB.toString() + "<br />" +
                "Number of Rummage Sales Attended " + NumRummageSales.toString() + "<br />" +
                "My Secret code: " + MySecret.toString() + "<br />" +
                "Sell on Ebay? " + SellonEbay.toString() + "<br />" +
                "Preferred Purchase MEthod: " + PurchaseMethod.toString() + "<br />" +
                "Favorite Categories: " + FavRummageCategories.toString()
            ;

            results.style = "background-color:" + Favcolor.toString();
            results.innerHTML = message;
        }
    </script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"> </script>
    <script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"></script>')</script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    
    <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
</body>
</html

/////////////////////////////////////////////////////////////////

CSS

body
{
    padding-top: 50px;
    padding-bottom: 20px;
}
.navbar{
    background-color:red;
}
div.jumbotron{
    background-color:lightpink;
}
thead th{
text-align:left;
background:red;
color:white;
border:solid black;
}
tbody th{
text-align:center;
background:red;
border:solid black;
}
tbody td{
border: thin solid black;
font-weight:bold;
text-align:center;
}
td img{
width:100px;
height:100px;
}

Explanation / Answer

I have corrected your html code.now it should work.(tested) :) .Some things were not defined

<title>Jumbotron Template for Bootstrap</title>

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

<link href="../../assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">

<link href="../css/homework.css" rel="stylesheet">

<body>

</fieldset>
                <br />

                <fieldset>
                    <legend>Preferences:</legend>
                    <label id="lblFavColor" class="myLabels">Favorite Color</label> <input type="color" name="favcolor" id="txtFavColor" value="#ff0000" /> <br />
                    <label id="lblDOB" class="myLabels">Date of Birth</label> <input type="date" id="txtDOB" /> <br />
                    <label id="lblNumRummageSales" class="myLabels">Number of Rummage Sales Attended</label> <input type="number" id="txtNumber" /> <br />
                    <input type="hidden" id="txtMySecret" value="Super Secret" />

<footer>
            <p>© 2016 Company, Inc.</p>
        </footer>
    
    
    <script>
        function processMyForm() {

            var FirstName = document.getElementById("txtFirstName").value;
            var LastName = document.getElementById("txtLastName").value;
            var Street = document.getElementById("txtStreet").value;
            var City = document.getElementById("txtCity").value;
            var PostalCode = document.getElementById("txtPostalCode").value;
            var State = document.getElementById("txtState").value;
            var Country = document.getElementById("txtCountry").value;
            var Phone = document.getElementById("txtPhone").value;
            var Email = document.getElementById("txtEmail").value;
            var Password = document.getElementById("txtPassword").value;
            var FavColor = document.getElementById("txtFavColor").value;
            var DOB = document.getElementById("txtDOB").value;
            var NumRummageSales = document.getElementById("txtNumber").value;
            var MySecret = document.getElementById("txtMySecret").value;

            var SellonEbay = "";
            var rdtxtSellonEbayYes = document.getElementById("rdYes").checked;
            var rdtxtSellonEbayNo = document.getElementById("rdNo").checked;

/////////////////////////////////////////////////////////////////

CSS

Navigate

////////////////C++ if else statement not working////////////// #include<iostrea

//////////1. Your investment in a small business venture will produce cash flows

Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.

///////////////Help with HTML5/Java//////////////////////////////////////// I ha

Question

Explanation / Answer

Related Questions

Navigate