Scribd
Upload
38 views7 pages

SWE 4001 Assignment - 2: Name: Reg No

The document contains two PHP and HTML assignments. The first assignment demonstrates a PHP callback function that processes different data types, while the second assignment involves creating an HTML page that uses AJAX to fetch and display student information based on a roll number entered by the user. Both assignments include complete code examples and styling for the web pages.

Uploaded by

ramcharan M
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
38 views7 pages

SWE 4001 Assignment - 2: Name: Reg No

The document contains two PHP and HTML assignments. The first assignment demonstrates a PHP callback function that processes different data types, while the second assignment involves creating an HTML page that uses AJAX to fetch and display student information based on a roll number entered by the user. Both assignments include complete code examples and styling for the web pages.

Uploaded by

ramcharan M
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 7

Name: Chakkilam Tarun Siddardha

Reg No: 21MIC7027

SWE 4001
Assignment – 2

1. Write PHP program for callback function to pass different data types to perform the operation.
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>PHP Callback Example</title>
<style>
body {
font-family: Arial, sans-serif;
background: linear-gradient(45deg, #ff6f61, #ffde59,
#6bffb8, #61a3ff);
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
margin: 0;
}
.container {
background-color: white;
padding: 20px;
border-radius: 10px;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
text-align: center;
max-width: 400px;
}
h1 {
color: #ff6f61;
margin-bottom: 20px;
}
p {
font-size: 1.2em;
color: #333;
margin: 10px 0;
}
</style>
</head>
<body>
<div class="container">
<h1>PHP Callback Function Example</h1>
<?php
// Callback function to perform operations based on data type
function processData($data, $callback) {
return $callback($data);
}

// Different callback functions for each data type


$callbacks = [
'integer' => function($data) { return $data * 2; },
'string' => function($data) { return strtoupper($data); },
'array' => function($data) { return array_sum($data); },
'boolean' => function($data) { return $data ? 'TRUE' :
'FALSE'; },
'object' => function($data) { return "Name: " . $data->name
. ", Age: " . $data->age; },
];

// Sample data of different types


$intData = 5;
$stringData = "hello world";
$arrayData = [1, 2, 3, 4, 5];
$boolData = true;
$objectData = (object)[ 'name' => 'Tarun Siidardha', 'age' =>
20 ];

// Process each data type using the respective callback


function
echo "<p>Integer: " . processData($intData,
$callbacks['integer']) . "</p>";
echo "<p>String: " . processData($stringData,
$callbacks['string']) . "</p>";
echo "<p>Array: " . processData($arrayData,
$callbacks['array']) . "</p>";
echo "<p>Boolean: " . processData($boolData,
$callbacks['boolean']) . "</p>";
echo "<p>Object: " . processData($objectData,
$callbacks['object']) . "</p>";
?>
</div>
</body>
</html>
Output:

2. Design a HTML page with text field and submit button. On clicking the submit button make an
AJAX request to a file named info.JSON and print the cooresponding information on the screen based
on the roll no.
Infor.JSON
Student[{101,”Vikaram”,68.9,”Male”},{112,”ram”,98.2,”Male”},{306,”Radha”,58.9,”Female”}]

Note: u have to enter roll no, after submit button corresponding information display on the screen

Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Student Info Lookup</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-
serif;
background: radial-gradient(circle, #2C5364, #203A43,
#0F2027);
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
margin: 0;
color: #fff;
}
.container {
background-color: #1E2D3B;
padding: 30px;
border-radius: 12px;
box-shadow: 0 12px 20px rgba(0, 0, 0, 0.3);
text-align: center;
max-width: 400px;
width: 100%;
}
h1 {
color: #00d4ff;
margin-bottom: 20px;
font-size: 24px;
}
input[type="text"] {
width: 85%;
padding: 12px;
margin: 15px 0;
border: none;
border-radius: 6px;
outline: none;
font-size: 16px;
background-color: #fff;
color: #333;
}
input[type="submit"] {
background-color: #00d4ff;
color: white;
padding: 12px 25px;
border: none;
border-radius: 6px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease;
}
input[type="submit"]:hover {
background-color: #00a3cc;
}
.result {
margin-top: 20px;
font-size: 1.2em;
background-color: #203A43;
padding: 15px;
border-radius: 8px;
color: #fff;
}
</style>
</head>
<body>
<div class="container">
<h1>Student Info Lookup</h1>
<form id="studentForm">
<input type="text" id="rollNo" placeholder="Enter Roll No">
<br>
<input type="submit" value="Submit">
</form>
<div class="result" id="result"></div>
</div>

<script>
// Embedded JSON data
const studentData = {
"Student": [
[101, "Tarun", 68.9, "Male"],
[112, "Saivikas", 98.2, "Male"],
[306, "Lahari", 58.9, "Female"]
]
};

document.getElementById('studentForm').addEventListener('submit',
function(event) {
event.preventDefault(); // Prevent form submission

let rollNo = document.getElementById('rollNo').value;


let resultDiv = document.getElementById('result');

// Find student by roll number


let student = studentData.Student.find(s => s[0] ==
rollNo);

// Display student info or error


if (student) {
resultDiv.innerHTML = `Roll No: ${student[0]}<br>Name:
${student[1]}<br>Marks: ${student[2]}<br>Gender: ${student[3]}`;
} else {
resultDiv.innerHTML = "Student not found!";
}
});
</script>
</body>
</html>
Output:

You might also like