Question

In: Computer Science

Assignment 2: Create a form that collects 5 different pieces of data. Once the user clicks...

Assignment 2:

  • Create a form that collects 5 different pieces of data.
  • Once the user clicks the submit button, the processing PHP file displays the data that was entered thru the form, performs a calculation, and displays the result.
    To receive full credit, students need to implement the following:
  1. Create variables with valid names and assign values to them
  2. Use literals and concatenate strings
  3. Use $_POST
  4. Use echo statements to display data on a page
  5. Code string and numeric expressions
  6. Use built-in function number_format(). (See provided example where the average displays only 2 decimals)
  7. Use the main.css file or create your own

Note: To receive credit, the files need to work as expected and be error free.

This is just an example to give you an idea of what Assignment 2 is supposed to do. You can use this example if you wish for your assignment:

  • The form collects first name, last name, score1, score2, score3.
  • The PHP file calculates the average of the 3 scores and displays the first name, last name and the average.

Solutions

Expert Solution

HTML file form to get user input, save the file as index.html:

<html>
<head></head>
<title>HTML+ PHP </title>
<link href="style.css" type="text/css" rel="stylesheet"/>
<body>
<form action="process.php" method="POST">
<input type="text" name="fname" placeholder =" Enter your first name : "><br>
<input type="text" name="lname" placeholder =" Enter your last name : "><br>
<input type="text" name="score1" placeholder =" Enter score1"><br>
<input type="text" name="score2" placeholder =" Enter score2 "><br>
<input type="text" name="score3" placeholder =" Enter score3"><br>
<input type="submit" value="Submit"><br>
</form>
</body>
</html>

--------------------------------------------------------------------------------------------

Use the below file as style sheet for html.css file

Save the below file as style.css

input[type="text"]
{
width: 200px;
border: 2px solid #aaa;
border-radius: 3px;
margin: 8px 0;
padding:8px 0;
}

input[type="submit"]
{
width: 200px;
box-shadow: 0 0 8px 0 dodgerBlue;
border-radius: 3px;
margin: 8px 0;
padding:8px 0;
  
}

--------------------------------------------------------------------------------------------

Php file to process the input get by the index.html file and display the values of first name, last name, and average score values.

Save the below file as "process.php"

<?php
//Get values of score1 , score2 and score3
$s1=$_POST['score1'];
$s2=$_POST['score2'];
$s3=$_POST['score3'];

//Calculate the average of three values
$result=($s1+$s2+$s3)/3.0;
  
   $result=number_format($result);

  
echo "First Name : ",$_POST['fname']."<br>";
echo "Last Name : ",$_POST['lname']."<br>";
echo "Average : ",$result."<br>";
?>

--------------------------------------------------------------------------------------------

Sample Output:

Input form :

Click on Submit button. The result will display as follows process.php

Note: To run the PHP files, apache server must be run in the background before running the files (Use xamp, start the apache server).

venereology answered 1 year ago
Next > < Previous

Related Solutions

Provide two text boxes for the user to enter in 2 values. Once the user clicks...
Provide two text boxes for the user to enter in 2 values. Once the user clicks off the second box, the sum of the two numbers displayed as a header level 2. here is what i have , and i cant find a way to display the sum of the numbers in each box in the header along with the other text. <h1>Problem 6</h1> <input type="text" id="txt1" onkeyup="sum();" /> <input type="text" id="txt2" onkeyup="sum();" /> <h2 id="txt3" result=""> The sum of...
Once the form in this file is submitted, create a new paragraph that will stack on...
Once the form in this file is submitted, create a new paragraph that will stack on top of the existing paragraphs and will contain the data entered into the textarea. Each new paragraph should have the class 'tweet' applied to it. *Hint: Remember to use return false; to stop the form submission from reloading the page. <!DOCTYPE html> <html> <head>    <title>Simple Twitter</title>    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">    <style>    .tweet{border-top:1px solid #dedede; padding:20px;}    </style>    <script...
Once the form in this file is submitted, create a new paragraph that will stack on...
Once the form in this file is submitted, create a new paragraph that will stack on top of the existing paragraphs and will contain the data entered into the textarea. Each new paragraph should have the class 'tweet' applied to it. *Hint: Remember to use return false; to stop the form submission from reloading the page. <!DOCTYPE html> <html> <head> <title>Simple Twitter</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> <style> .tweet{border-top:1px solid #dedede; padding:20px;} </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body class="container" style="width:50%"> <h1>Twitter</h1>...
ISYS 350, Assignment 2, Part 1: Create a C# Form with a textbox and a button....
ISYS 350, Assignment 2, Part 1: Create a C# Form with a textbox and a button. The box is for a user to enter a number of seconds. And when the user clicks the button, the program displays the equivalent number of hours, minutes and seconds using a MessageBox. Show method. If the seconds entered is less than 60, your program should only display the seconds; if the seconds is a least 60 and less than 3600, your program should...
How many data points (pieces of data were used to create the regression equation?
How many data points (pieces of data were used to create the regression equation)?Regression StatisticsMultiple RR SquareAdjusted R SquareStandard ErrorObservations8ANOVAdfSSMSFRegression1333311Residual6233Total7CoefficientsStandard Errort StatP-valueIntercept1031.2746663.9842840.007248Advertising (thousands of $)126.193306741.6108020.158349
Directions of assignment: - Create an array of words of size 10. - Prompt the User...
Directions of assignment: - Create an array of words of size 10. - Prompt the User to enter the 10 integers. Populate the array with the integers as they are entered. - You MUST use indexed addressing to traverse through the array. - Determine the maximum and the minimum values contained within the array and print them out. Can you see what I am doing wrong here, the last part (to find the min and max) I can't seem to...
5) Create the following in a Java program Create a scanner Prompt the user to enter...
5) Create the following in a Java program Create a scanner Prompt the user to enter the name where the box of mail is shipping from and create the variable and relate to scanner Prompt the user to enter the name of destination where the box of mail will be shipped and create the variable and relate to scanner Prompt the user to enter the weight of the package and create variable to relate to scanner Calculate cost of shipping...
CompSci 251 Assignment 1 Due Sep. 23rd, 2019 Create a program that will format long pieces...
CompSci 251 Assignment 1 Due Sep. 23rd, 2019 Create a program that will format long pieces of text based on user input. User input will determine the number of indents allowed for the first line in each paragraph, the number of characters allowed per line, and the number of sentences allowed per paragraph. There are three pieces of text, where each is a famous speech that is represented by a single String variable at the top of the base file....
JAVA Programming Implement the class DataProcess and prompt a user to enter 5 integer numbers. Once...
JAVA Programming Implement the class DataProcess and prompt a user to enter 5 integer numbers. Once The program should output the average, largest, and smallest of 5 numbers. You must implement the methods listed below in your program. static float getAverage(int[] data) {...} static int getLargest(int[] data) {...} static int getSmallest(int[] data) {...}
5 different types of organizational forms: Functional form Divisional form Matrix form Parallel form Modular form...
5 different types of organizational forms: Functional form Divisional form Matrix form Parallel form Modular form Based on each definition and textbook examples discuss a pro & con of each form.
ADVERTISEMENT
Subjects
ADVERTISEMENT
Latest Questions
ADVERTISEMENT