I have an assignment to create the web page. One of the points is to make able to change the style of the text through checkboxes. Web programming is not my primary areas, (I am mostly in C#). I don't know how to do it through PHP, as we have started learning recently.
There is my PHP code.
<?php
$firstName = "Yaroslav";
$lastName = "Yatsyk";
$studentID = "101343887";
$checks = [];
$courses = array("COMP1230"=>"Advanced Web Programming", "COMP2129" => "Advanced Object-Oriented Programming", "COMP2130" => "Application Development using Java",
"COMP2138" => "Advanced Database Development","COMP2147" => "System Analysis, Design And Testing", "GSCI1003" => "Statistics");
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Assignment 1</title>
<meta name="description" content="Sending data by GET/POST method">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="author" content="Yaroslav Yatsyk">
<link rel="stylesheet" href="101343887.css">
</head>
<body>
<h1>
<?php
echo $firstName . " " . $lastName . " - " . $studentID;
?>
</h1>
<form action="101343887.php" action="POST">
<section id="textFiled">
Name: <input type="text" value="<?php echo $firstName?> " name="name" required>
<br><br>
Surname: <input type="text" value="<?php echo $lastName?>" name="surname" required>
<br><br>
Student ID: <input type="text" value="<?php echo $studentID?>" name="id" required>
<br><br>
Class: <input list = "classes" name="classes" id="classes" required>
<datalist id="classes">
<?php
foreach($courses as $key=>$value){
echo "<option>".$key."</option>"."<br />";
}
?>
</datalist>
</section>
<br>
<section id="checkBoxes">
<input type="checkbox" name="check[]" id="Strong" value="strong">
<label for="Strong">Strong</label>
<br><br>
<input type="checkbox" name="check[]" id="Underline" value="underline">
<label for="Underline">Underline</label>
<br><br>
<input type="checkbox" name="check[]" id="Uppercase" value="uppercase">
<label for="Uppercase">Uppercase</label>
</section>
<br><br>
<section id="radios">
<input type="radio" name="12ptx" id="12ptx" value="12pt">
<label for="12ptx">12pt</label>
<br><br>
<input type="radio" name="18ptx" id="18ptx" value="18pt">
<label for="18ptx">18pt</label>
<br><br>
<input type="radio" name="24ptx" id="24ptx" value="24pt">
<label for="24ptx">24pt</label>
</section>
<br>
<input type="submit" value="Submit">
</form>
<section id="output" style="height: 150px; width: 150px;">
<h2>
<?php
if(filter_input(INPUT_POST,'name',FILTER_SANITIZE_STRING) && filter_input(INPUT_POST,'surname',FILTER_SANITIZE_STRING) && (
filter_input(INPUT_POST,'id',FILTER_SANITIZE_STRING)
))
{
$firstName = $_POST['name'];
$lastName = $_POST['surname'];
$studentID = $_POST['id'];
if(isset($_POST['check']) && !empty($_POST['check'])) {
$checks = $_POST['check'];
// Add code
}
}
echo $firstName . " " . $lastName . " " . $studentID;
?>
</h2>
</section>
<div>
<?php
if(isset($_POST["classes"])) {
$key = $_POST["classes"];
}
echo $courses[$key];
?>
</div>
<?php
echo "<hr>";
echo show_source("101343887.php");
?>
<script src=https://my.gblearn.com/js/loadscript.js></script>
</body>
</html>
There is my CSS code
#textFiled input[type=text] {
width: 25%;
height: 25%;
padding: 10px 15px;
margin: 8px 0;
box-sizing: border-box;
}
#textFiled input[type=checkbox] {
width: 25%;
height: 25%;
padding: 10px 15px;
margin: 8px 0;
box-sizing: border-box;
}
.uppercase {
text-transform: uppercase;
}
.underline {
text-decoration: underline;
}
.strong {
font-weight: bold;
}
Please do not be toxic, or do not put minus scores, as I have just begun learning programming at college, and not all things are understandable. I am willing to be better, but I need professional assistance to approach it. Thank you