1 answer

Could I get some help with the following Task? The program should be implemented in JavaScript and running on Firefox,

Question:

Could I get some help with the following Task?

The program should be implemented in JavaScript and running on Firefox, a web browser independent to operating systems. The client has specified the following requirements for the functionality of the program:

1. The program should be running without errors throughout two Phases: Information Gathering and Information Presenting.

2. Information Gathering is to gather the information such as state/territory name, the population and population change over previous year for calculation of APG;

3. The program should first confirm with the user for willingness of entering a new state/territory before proceeding to gather information of the state/territory name, population and population change over previous year for calculation.

4. When receiving a new entry for a state/territory, the program should first prompt and ask the user to enter the state/territory name. If the user enters nothing or an invalid state/territory name, the program should alert an error message on screen and then prompt the user to re-enter. The process should iterate until a state/territory name is entered.

5. If the entered state/territory name is valid, the program should then prompt the user to input the population and population change over previous year for the state/territory. Again, if nothing or an invalid value is entered, the program should display an error message then iterate until receive valid population and population change over previous year value.

6. After valid input of state/territory name, the population and population change over previous year, the program should loop back to seek user confirmation for either proceeding to add one more state/territory or moving to the Information Presenting phase to calculate and display the results;

7. If the user confirms no more state/territory to enter, the Information Gathering phase is completed and the program then moves to Information Presenting.

8. In the Information Presenting phase, the program prints on the web page a table containing all entered state/territory(s), including information such as state/territory name, the population and growth rate (Growth rate = population change over previous year/ population).

9. To make the APG calculator user-friendly, the client also expects the program to display some statistic information: - The state/territory(s) with the highest growth rate; -


Answers

Explanation :

Assumption - All the states data will be provided at one go.This program will give consistent results only when the states are inserted in the array at the same time.

There are two buttons provided on the front end Submit and InformationProcessing.

By Default submit button is enabled and InformationProcessing is disabled.

Only string is allowed as an input in the State/Territory box.

This code has been tested with only two valid states : Alabama and Alaska.Both these states are maintained in an array.

(You can add as many states you want by adding comma separated values in the states array)

Validations:

Program checks whether the state entered by the user matches any of the states provided in the array.If it is an exact match.Since javascript is case sensitive you will have to provide the exact values that are provided in the states array.

A validstates array is used in order to keep track of the states entered by user.

Population and PopulationChange value should always be a positive number

.

Limitations:

This program assumes that the user will enter all the states at the same time.

As the number of states grow the array size will increase and it would be difficult to map those states and provide validations.

To overcome this limitation,we can populate the states from a .txt file or can retreive it from the database.

I have kept code simple in order to avoid complexity.

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8" ng-app="demo">
   <title>Information Gathering</title>
   <script type="text/javascript">
window.onload = function() {
//confirmationDialog();
document.getElementById("stateDiv").style.visibility="hidden";
if(confirmationDialog()){
displayState();
}

};
       var states=[' Alabama','Alaska'];

       var validstates=[];


      
       function confirmationDialog(){
           var retVal = confirm("Do you want to continue ?");
if( retVal == true ) {
// document.write ("User wants to continue!");
  
return true;
} else {
document.write ("User does not want to continue!");
return false;
}
       }

/*Function to validate that the states textbox takes only alphabets*/
function onlyAlphabets(e, t) {
try {
if (window.event) {
var charCode = window.event.keyCode;
}
else if (e) {
var charCode = e.which;
}
else { return true; }
if ((charCode > 64 && charCode < 91) || (charCode > 96 && charCode < 123))
return true;
else
return false;
}
catch (err) {
alert(err.Description);
}
}

//It validates the form against the input provided by the user

   function validateForm(){  
var state=document.getElementById("state").value;
       var population=document.getElementById('population').value;
var populationc=document.getElementById('populationc').value;
var isPopulationValid=true;
var isPopulationCValid=true;
       if(state=="" || state==undefined) {
           alert("Please enter valid state/territory");
           state.innerHTML="";
       }

       if(population=="" || population==undefined || population < 0) {
           alert("Please enter valid values for population");
           isPopulationValid=false;
           population.innerHTML="";
       }

       if(populationc=="" || populationc==undefined || populationc<0) {
           alert("Please enter valid values for population change");
           isPopulationCValid=false;
           populationc.innerHTML="";
       }


       var isStatevalid=true;
   if(state!=""){
       for(var i=0;i<states.length;i++){
           if(states.indexOf(state)>-1){
               validstates.push(state);
           }else{
               isStatevalid=false;
               break;
           }
       }

       if(isStatevalid){
           document.getElementById("population").disabled=false;
               document.getElementById("populationc").disabled=false;
           }else{
               alert("Please enter valid state");
           }

           if(isPopulationCValid && isPopulationValid){
               document.getElementById("informationb").disabled=false;
           }
   }
}

//Function that is used to process the information.

function ProcessInformation() {

var newTable,startTag,endTag;


document.getElementById("informationp").style.display="block";
//Creating a new table

startTag="<TABLE id='mainTable'><TBODY><TR><TD style=\"WIDTH: 120px\">State</TD><TD style=\"WIDTH: 120px\">Population</TD><TD style=\"WIDTH: 120px\">GrowthRate</TD></TR>"

endTag="</TBODY></TABLE>"

newTable=startTag;

var trContents;

//Get the row contents

trContents=document.body.getElementsByTagName('TR');

if(trContents.length>1)

{

for(i=1;i<trContents.length;i++)

{

if(trContents[i].innerHTML)

{

// Add previous rows

newTable+="<TR>";

newTable+=trContents[i].innerHTML;

newTable+="</TR>";

}

}

}

//Add the Latest row

newTable+="<TR><TD style=\"WIDTH: 120px\" >" +
document.getElementById('state').value +"</TD>";

newTable+="<TD style=\"WIDTH: 120px\" >" +
document.getElementById('population').value +"</TD>";
var population=document.getElementById('population').value;
var populationc=document.getElementById('populationc').value;

if(isNaN(population) || isNaN(populationc)){
perc=" ";
}else{
perc = ((populationc/population) * 100).toFixed(3);
}

newTable+="<TD style=\"WIDTH: 120px\" >" +perc
+"</TD><TR>";

newTable+=endTag;

//Update the Previous Table With New Table.

document.getElementById('informationp').innerHTML=newTable;

}
   </script>
</head>
<body>
<div id="stateDiv">
   <p>State/Territory Name</p>
   <input type="text" id="state" onkeypress="return onlyAlphabets(event,this);"/>
   <p>Population</p>
   <input type="number" id="population" disabled="true" />
   <p>Population Change</p>
   <input type="number" id="populationc" disabled="true"/><br><br>

   <input type="submit" value="submit" onclick="confirmationDialog()">

   <input type="submit" value="InformationProcessing" id="informationb" onclick="ProcessInformation()" disabled>
</div>

   <div id="informationp" style="display:none;">
       <table id="mainTable">

<tr style="width:120px " >

<td >state</td>

<td>Population</td>

<td>Growth rate</td>

</tr>

</table>

   </div>


</body>
<script type="text/javascript">
   function displayState(){
           document.getElementById("stateDiv").style.visibility="visible";
   }
</script>
</html>

.

Similar Solved Questions

1 answer
N=pq with p,q distinct odd primes. Give an expression for the order of (Z/NZ)x in terms of p and q. Then, give an expression for the maximum order of a single element in (Z/NZ)x in terms of p and q.Wh...
N=pq with p,q distinct odd primes. Give an expression for the order of (Z/NZ)x in terms of p and q. Then, give an expression for the maximum order of a single element in (Z/NZ)x in terms of p and q.Why does that imply that there does not exist a primitive root modulo N?...
1 answer
Find the maximum Find the maximum velocity of the mass. A 2.0 g bullet at 30...
Find the maximum Find the maximum velocity of the mass. A 2.0 g bullet at 30 degree C is tired at 200 m/s at a large block of ice at 0 degree C and get stuck there. As a result of this, some. but not all, of the ice melts. What is the final temperature of bullet? Find how much mass of the ice melts ...
1 answer
N's office building with an adjusted basis of $750,000and a fair market value of $900,000 is...
n's office building with an adjusted basis of $750,000and a fair market value of $900,000 is condemned on 8. Sam is a calendar year taxpayer. He receives a condemnation award of $875,000 on March 1, Whe, s a new office building at a cost of $845,000 which is completed and paid for on December 31...
2 answers
Choose the correct answer below
The equation of the function h(x) that is a reflection of graph of g(x) about the x-axis is given by which of the following?A) h(x)=h(x)B) h(x)=-g(x)C) h(x)=g(-x)D) h(x)=h(x)/g(x)...
1 answer
Typed please Question Set 1 A nurse shared the following on her Facebook page: “I just...
typed please Question Set 1 A nurse shared the following on her Facebook page: “I just saw a famous person at the hospital! I think he was just visiting his mom. He just as gorgeous in person as he on TV – he definitely lives up to his ‘Dr. McDreamy’ name!” What are the...
1 answer
Due Tuesday Problem Set 7 Econ 2301 Feb 18 Name 1. If the exchange rate between...
Due Tuesday Problem Set 7 Econ 2301 Feb 18 Name 1. If the exchange rate between the US and Mexico let's look at price of one dollar in Mexican pesos) changes from 12 pesos = $1 to 18 pesos = $1 (as happened between about 2013 and spring 2016), a. the dollar has appreciated in value b. the peso h...
1 answer
What the is the polar form of #y^2 = (x-3)^2/y-x^2 #?
What the is the polar form of #y^2 = (x-3)^2/y-x^2 #?...
1 answer
Robert’s demand curve for good X is given by the equation X = 100 - 2PX....
Robert’s demand curve for good X is given by the equation X = 100 - 2PX. (5 points) a. What is the elasticity of demand at the point X=20, PX =40? (5 points) b. If price falls from PX =40 to PY =35, what happens to total spending for X and what does this imply about the elasticity of demand? (...
1 answer
Part A and Part B for reference: Chapter 18 <Chapter 18 Byproducts of Burning Fossil Fuels...
Part A and Part B for reference: Chapter 18 <Chapter 18 Byproducts of Burning Fossil Fuels © 10 0f 15 > Review Constants Periodic Table Coal is a fossil fuel made primarily of carbon, but it also contains sulfur among other elements. Submit Previous Answers When carbon, C, burns in air, ...
1 answer
Express each of the following expressions in the form nPr or in the form nCr a
express each of the following expressions in the form nPr or in the form nCra. 27x26x25x24/4x3x2x1b. 30x29x28x27x26...
1 answer
Show Attempt History Current Attempt in Progress Splish Inc. reported income from continuing operations before taxes...
Show Attempt History Current Attempt in Progress Splish Inc. reported income from continuing operations before taxes during 2020 of $796,800. Additional transactions occurring in 2020 but not considered in the $796,800 are as follows. 1. The corporation experienced an uninsured flood loss in the amo...
1 answer
What does a correlation coefficient of 0 indicate? Choose the correct answer below. O A. There...
What does a correlation coefficient of 0 indicate? Choose the correct answer below. O A. There is no linear relationship between the two quantitative variables. O B. There is a weak relationship between the two quantitative variables. O C. It indicates a calculation error, as the correlation coeffic...
1 answer
2. (15p) We shall consider a function A, defined by the recurrences A(0,n n+1 for n...
2. (15p) We shall consider a function A, defined by the recurrences A(0,n n+1 for n 20 for m>0 for m, n > 0 A(m, n) A(m-1, A(m, n-1)) = Observe that A(1,1) = A(0,A(1,0))=A(0,2) = 3 A(1,2 A(0, A(1, 1)) A(0,34 and it is now not hard to see (as can be proved by an easy induction) that A(1,n)n 2 f...
1 answer
1. To round and format the value of a variable named Snumber to 3 decimal places...
1. To round and format the value of a variable named Snumber to 3 decimal places and store it in a variable named Snumber formatted, you code a. Snumber_ formatted - number format (Snumber, 3, round) b. Snumber formatted - number format (8number, 3) c. $number formatted format_number (Snumber, 3, ro...
1 answer
Can anyone help me solve these on MATLAB?? please intro to programming and computation 3. 50...
can anyone help me solve these on MATLAB?? please intro to programming and computation 3. 50 points - The purpose of this question is to test your ability to write for loops, so you won't get points if your answer works without using for loop. A vector is given by V - (5. 17. -3,8,0,-7. 12, 1...
1 answer
Consider these two substances: Substance J is at temperature T = 880 K, and substance K...
Consider these two substances: Substance J is at temperature T = 880 K, and substance K is at T = 990 K. They are in thermal contact. Substance J actually heats up Substance K. True False...