Index: Sr. No. Programs Remarks

INDEX
Sr. No. Programs Page Remarks
1 PHP Code to display today’s date in dd-mm-yyyy format. 1

2 PHP Code to check if number is prime or not. 2
3 PHP Code to print first 10 Fibonacci Numbers. 3
4 PHP Code to read data from txt file and display it in html table 4
(the file contains info in format Name: Password: Email )
5 PHP Script for login authentication. Design an HTML form 5-6
which takes username and password from user and validate
against stored username and password in file.
6 PHP Script for user authentication using PHP-MYSQL. Use 7-8
session for storing username.
7 PHP Script for user authentication using PHP-MYSQL. Use 9
session for storing username.
8 Create XML documents for chosen application and validate 10-12
using DTD and schema. Also render the content of XML
document using XSL. Scenarios include  XML document must
have attributes and elements so that they can be validated
against DTD/Schema.  Check the data types of variables
declared in XML document using Schema.  Display the details
of data contained in XML document in a table using XSL.
9 Modify the specific web applications to use AJAX to show the result 13
on the same page.
10 Create a responsive Photo Gallery in BOOTSTRAP 14
11 Suppose you have a list of Students having Student’s Name, 15-16
Roll Number, Marks in five subjects, Show this list in a
responsive table in BOOTSTRAP
12 Build a Registration Form and Validate it with JQuery. 17-18
Registration Form must have at least 10 elements.
13 Create a Star Rating System in JQuery. 19-20
14 Create a simple To-do list Application with REACT 21-23
15 Create a Calculator with REACT 24
0|Page
1. PHP Code to display today’s date in dd-mm-yyyy format.
<!DOCTYPE html>
<html>
<body>
<?php
echo "Today is " . date("d-m-Y") . "<br>";
?>
</body>
</html>
Output :-
1|Page
2. PHP Code to check if number is prime or not.
<?php
$MyNum = 17;
$n = 0;
for($i = 2; $i < $MyNum; $i++) {
if($MyNum % $i == 0){
$n++;
break;
if ($n == 0){
echo $MyNum." is a prime number.";
} else {
echo $MyNum." is not a prime number.";
?>
Output:-
2|Page
3. PHP Code to print first 10 Fibonacci Numbers.
<?php
echo "<h3>Fibonacci series for first 12 numbers: </h3>";
function Fibonacci($number){
// if and else if to generate first two numbers

if ($number == 0)
return 0;
else if ($number == 1)
return 1;
// Recursive Call to get the upcoming numbers

else
return (Fibonacci($number-1) +
Fibonacci($number-2));
}
// Driver Code
$number = 10;
for ($counter = 0; $counter < $number; $counter++){
echo Fibonacci($counter),' ';
}
?>
Output :-
3|Page
4. PHP Code to read data from txt file and display it in html table (the file contains info in format
Name: Password: Email )
<?php
$lines = file("data.txt", FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
$data = array_map(function ($v) {
list($username, $score) = explode(":", $v);
return ["username" => $username, "score" => $score];
}, $lines);
usort($data, function ($a, $b) {

if ($a["score"] == $b["score"]) return 0;
return $a["score"] > $b["score"] ? 1 : -1;
});
?>
<table width="200" border="1">

<tr>
<td width="85">Nom</td>
<td width="99">Score</td>
</tr>
<?php foreach ($data as $user) { ?>
<tr>
<td height="119"><?php echo $user["username"]; ?></td>
<td><?php echo $user["score"]; ?></td>
</tr>
<?php } ?>
</table>
Output
4|Page
5. PHP Script for login authentication. Design an HTML form which takes username and password
from user and validate against stored username and password in file.
1)Login.php
<?php
// Read the file containing the stored username and password
$file = file_get_contents('login.txt');
$lines = explode("\n", $file);
$stored_username = trim($lines[0]);
$stored_password = trim($lines[1]);
// Check if the form was submitted

if (isset($_POST['username']) && isset($_POST['password'])) {
// Get the username and password from the form
$username = $_POST['username'];
$password = $_POST['password'];
// Check if the entered username and password match the stored values
if ($username == $stored_username && $password == $stored_password) {
echo "Login successful!";
} else {
echo "Invalid username or password.";
}
} else {
echo "Please submit the form.";
}
?>
2)auth.html
<form action="login.php" method="post">

<label for="username">Username:</label>
<input type="text" id="username" name="username"><br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password"><br><br>
<input type="submit" value="Submit">
</form>
3)Login.txt
Output :
5|Page
HTML Form :
Login Authentication :
6|Page
6. PHP Script for user authentication using PHP-MYSQL. Use session for storing username.
Register.php
<html>
<head>
<title>Registration Page</title>
</head> <body>
<h1> Registration Page</h1><br />
<form action="insert.php" method="post"> Name <input type="text" name="fname"

id="fname" value="name" ><br>
Password <input type="password" name="pwd" id="pwd" value="password" /><br />
Email <input type="text" name="email" id="email" value="email@example.com"/><br
/>
Phone Number <input type="text" name="ph" id="ph" value="9999999999"
maxlength="10"><br/>
<input type="submit" value="Submit" />
</form> </body>
</html>
Insert .php
<?php$con= mysqli_connect("localhost","root","root","srikanth"); if (!$con)
die("Could not connect:'. mysql_error());
if (!$con)
die('Could not connect: '. mysql_error());
mysql_select_db("ivcse", $con);
$sql="INSERT INTO login (name, password, email, phno) VALUES

($_POST[fname]','$_POST[pwd]','$_POST[email]', '$_POST[ph]')";
if (!mysqli_query($con, $sql))
die('Error:'. mysqli_error());
echo "I record added";
echo "<br><br>";
echo "You want to register another user, Click <a href='register.html">here</a>";
mysqli_close($con);
?>
7|Page
8|Page
7. PHP Script for user authentication using PHP-MYSQL. Use session for storing username.
Auth.html
<!DOCTYPE html>
<html>
<head>
<title>Text File Storage</title>
</head>
<body>
<h2>Text File Storage</h2>
<form method="POST" action="store.php">
<label for="inputText">Enter Text:</label>
<input type="text" name="inputText" required><br><br>
<input type="submit" name="submit" value="Submit">
<input type="reset" value="Reset">
</form>
</body>
</html>
Store.php
<?php
if (isset($_POST['submit'])) {
$inputText = $_POST['inputText'];
// Store the text in a text file

$file = 'data.txt';
$data = "Text: " . $inputText . "\n";
file_put_contents($file, $data, FILE_APPEND);
// Display the stored text

echo "Text stored successfully! The entered text is: " . $inputText;
}
?>
Output
9|Page
8. Create XML documents for chosen application and validate using DTD and schema. Also render
the content of XML document using XSL. Scenarios include  XML document must have attributes
and elements so that they can be validated against DTD/Schema.  Check the data types of
variables declared in XML document using Schema.  Display the details of data contained in XML
document in a table using XSL.
Book.xml
<?xml version="1.0" encoding="UTF-8"?>
<library xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="books.xsd">
<book id="1">
<title>The Great Gatsby</title>
<author>F. Scott Fitzgerald</author>
<year>1925</year>
</book>
<book id="2">
<title>To Kill a Mockingbird</title>
<author>Harper Lee</author>
<year>1960</year>
</book>
</library>
Books.dtd
<!DOCTYPE library [
<!ELEMENT library (book+)>
<!ELEMENT book (title, author, year)>
<!ATTLIST book id CDATA #REQUIRED>
<!ELEMENT title (#PCDATA)>
<!ELEMENT author (#PCDATA)>
<!ELEMENT year (#PCDATA)>
]>
Books.xsd
<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema">
<xs:element name="library">
<xs:complexType>
<xs:sequence>
<xs:element name="book" maxOccurs="unbounded">
<xs:complexType>
10 | P a g e
<xs:sequence>
<xs:element name="title" type="xs:string"/>
<xs:element name="author" type="xs:string"/>
<xs:element name="year" type="xs:integer"/>
</xs:sequence>
<xs:attribute name="id" type="xs:string" use="required"/>
</xs:complexType>
</xs:element>
</xs:sequence>
</xs:complexType>
</xs:element>
</xs:schema>
11 | P a g e
Books.xsl
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:template match="/">
<html>
<head>
<style>
table {
border-collapse: collapse;
width: 100%;
}
th, td {
padding: 8px;
text-align: left;
border-bottom: 1px solid #ddd;
}
</style>
</head>
<body>
<h2>Books</h2>
<table>
<tr>
<th>ID</th>
<th>Title</th>
<th>Author</th>
<th>Year</th>
</tr>
<xsl:for-each select="library/book">
<tr>
<td><xsl:value-of select="@id"/></td>
<td><xsl:value-of select="title"/></td>
<td><xsl:value-of select="author"/></td>
<td><xsl:value-of select="year"/></td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
12 | P a g e
9. Modify the specific web applications to use AJAX to show the result on the same page.
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
// Attach event listener to the form submission
$('form').submit(function(event) {
event.preventDefault(); // Prevent default form submission
// Collect form data

var formData = $(this).serialize();
// Make an AJAX request

$.ajax({
url: 'process.php', // Replace with your server-side script URL
type: 'POST', // Or 'GET' depending on your server-side code
data: formData,
success: function(response) {
// Update the result element with the received data
$('#result').html(response);
},
error: function() {
// Handle AJAX error
alert('An error occurred.');
}
});
});
});
</script>
</head>
<body>
<form>

<input type="text" name="input1">
<input type="submit" value="Submit">
</form>
<div id="result"></div> 

</body>
</html>
13 | P a g e
10. Create a responsive Photo Gallery in BOOTSTRAP
Bootsrap.html
<!DOCTYPE html>
<html>
<head>
<title>Responsive Photo Gallery</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<style>
.gallery-container {
display: flex;
flex-wrap: wrap;
}
.gallery-item {
width: 300px;
margin: 10px;
}
.gallery-item img {
width: 100%;
height: auto;
}
</style>
</head>
<body>
<div class="container">
<h2>Photo Gallery</h2>
<div class="gallery-container">
<div class="gallery-item">
<img src="path/to/image1.jpg" alt="Image 1">
</div>
</div>
</div>

</div>
</div>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</body>
</html>
Output
14 | P a g e
11. Suppose you have a list of Students having Student’s Name, Roll Number, Marks in five
subjects, Show this list in a responsive table in BOOTSTRAP
<!DOCTYPE html>
<html>
<head>
<title>Student List</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<h2>Student List</h2>
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Roll Number</th>
<th>Subject 1</th>
<th>Subject 2</th>
<th>Subject 3</th>
<th>Subject 4</th>
<th>Subject 5</th>
</tr>
</thead>
<tbody>
<tr>
<td>Rohan</td>
<td>001</td>
<td>90</td>
<td>85</td>
<td>95</td>
<td>88</td>
<td>92</td>
</tr>
<tr>
<td>Mansi</td>
<td>002</td>
<td>88</td>
<td>92</td>
<td>78</td>
<td>85</td>
<td>90</td>
</tr>
<tr>
<td>Rahul</td>
<td>003</td>
<td>63</td>
<td>81</td>
<td>87</td>
<td>58</td>
<td>68</td>
15 | P a g e
</tr>
<tr>
<td>Parminder</td>
<td>004</td>
<td>88</td>
<td>99</td>
<td>71</td>
<td>83</td>
<td>91</td>
</tr>
<tr>
<td>Yash</td>
<td>005</td>
<td>89</td>
<td>97</td>
<td>72</td>
<td>81</td>
<td>93</td>
</tr>

</tbody>
</table>
</div>
</div>
</body>
</html>
Output
16 | P a g e
12. Build a Registration Form and Validate it with JQuery. Registration Form must have at least 10
elements.
<!DOCTYPE html>
<html>
<head>
<title>Registration Form</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<style>
.error {
color: red;
}
</style>
</head>
<body>
<h2>Registration Form</h2>
<form id="registrationForm" method="post">
<div>
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
</div>
<div>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
</div>
<div>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required>
</div>
<div>
<label for="confirmPassword">Confirm Password:</label>
<input type="password" id="confirmPassword" name="confirmPassword" required>
</div>
<div>
<label for="phone">Phone:</label>
<input type="text" id="phone" name="phone" required>
</div>
<div>
<label for="address">Address:</label>
<input type="text" id="address" name="address" required>
</div>
<div>
<label for="city">City:</label>
<input type="text" id="city" name="city" required>
</div>
<div>
<label for="state">State:</label>
<input type="text" id="state" name="state" required>
</div>
<div>
<label for="zip">Zip Code:</label>
<input type="text" id="zip" name="zip" required>
17 | P a g e
</div>
<div>
<label for="country">Country:</label>
<input type="text" id="country" name="country" required>
</div>
<br>
<input type="submit" value="Register">
</form>
<script>
$('#registrationForm').submit(function(event) {
var name = $('#name').val();
var email = $('#email').val();
var password = $('#password').val();
var confirmPassword = $('#confirmPassword').val();
var phone = $('#phone').val();
var address = $('#address').val();
var city = $('#city').val();
var state = $('#state').val();
var zip = $('#zip').val();
var country = $('#country').val();
// Validation rules
var nameRegex = /^[a-zA-Z ]+$/;
var emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
var passwordRegex = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[0-9a-zA-Z]{8,}$/;
var phoneRegex = /^\d{10}$/;
var zipRegex = /^\d{5}$/;
// Clear previous error messages

$('.error').remove();
// Perform validation
if (!name.match(nameRegex)) {
$('#name').after('<span class="error">Please enter a valid name.</span>');
event.preventDefault();
}
If
Output
18 | P a g e
13. Create a Star Rating System in JQuery.
<!DOCTYPE html>
<html>
<head>
<title>Star Rating System</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<style>
.rating {
unicode-bidi: bidi-override;
direction: rtl;
text-align: center;
}
.rating span {
font-size: 30px;
cursor: pointer;
display: inline-block;
width: 30px;
margin-right: 5px;
}
.rating span:before {
content: "\2605";
}
.rating span.checked:before {
content: "\2605";
color: gold;
}
</style>
</head>
<body>
<h2 style="text-align: center; font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-
serif;">Star Rating System</h2><br>
<BR>
<p style="text-align: center; font-family: cursive;">Pathan-Bollywood Movie</p>

<div class="rating">
<span class="star" data-value="1"></span>
</div>
<p style="text-align: center; font-family: cursive;"> John Wick-Hollywood Movie</p>

</div>
<p style="text-align: center; font-family: cursive;"> RRR-Pollywood Movie</p>

19 | P a g e
</div>
<script>
$('.star').click(function() {
var value = $(this).data('value');
$('.star').removeClass('checked');
// Add 'checked' class to clicked star and previous stars

for (var i = 1; i <= value; i++) {
$('.star[data-value="' + i + '"]').addClass('checked');
}
});
});
</script>
</body>
</html>
Output
20 | P a g e
14. Create a simple To-do list Application with REACT
// App.js File
import React, { Component } from "react";
import "bootstrap/dist/css/bootstrap.css";
import Container from "react-bootstrap/Container";
import Row from "react-bootstrap/Row";
import Col from "react-bootstrap/Col";
import Button from "react-bootstrap/Button";
import InputGroup from "react-bootstrap/InputGroup";
import FormControl from "react-bootstrap/FormControl";
import ListGroup from "react-bootstrap/ListGroup";
class App extends Component {

constructor(props) {
super(props);
// Setting up state
this.state = {
userInput: "",
list: [],
};
}
// Set a user input value

updateInput(value) {
this.setState({
userInput: value,
});
}
// Add item if user input in not empty

addItem() {
if (this.state.userInput !== "") {
const userInput = {
// Add a random id which is used to delete
id: Math.random(),
// Add a user value to list

value: this.state.userInput,
};
// Update list
const list = [...this.state.list];
list.push(userInput);
// reset state
this.setState({
list,
userInput: "",
});
}
}
// Function to delete item from list use id to delete

deleteItem(key) {
const list = [...this.state.list];
// Filter values and leave value which we need to delete
21 | P a g e
const updateList = list.filter((item) => item.id !== key);
// Update list in state

this.setState({
list: updateList,
});
}
render() {
return (
<Container>
<Row
style={{
display: "flex",
justifyContent: "center",
alignItems: "center",
fontSize: "3rem",
fontWeight: "bolder",
}}
>
TODO LIST
</Row>
<hr />
<Row>
<Col md={{ span: 5, offset: 4 }}>
<InputGroup className="mb-3">
<FormControl
placeholder="add item . . . "
size="lg"
value={this.state.userInput}
onChange={(item) =>
this.updateInput(item.target.value)
}
aria-label="add something"
aria-describedby="basic-addon2"
/>
<InputGroup>
<Button
variant="dark"
className="mt-2"
onClick={() => this.addItem()}
>
ADD
</Button>
</InputGroup>
</InputGroup>
</Col>
</Row>
<Row>
<Col md={{ span: 5, offset: 4 }}>
<ListGroup>
{/* map over and print items */}
{this.state.list.map((item) => {
return (
<ListGroup.Item
variant="dark"
22 | P a g e
action
onClick={() =>
this.deleteItem(item.id)}
>
{item.value}
</ListGroup.Item>
);
})}
</ListGroup>
</Col>
</Row>
</Container>
);
}
}
export default App;
23 | P a g e
15. Create a Calculator with REACT.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,
initial-scale=1, shrink-to-fit=no">
<title>GeeksforGeeks Calculator</title>
</head>
<body>

<div id="root"></div>
</body>
</html>
Output
24 | P a g e

Index: Sr. No. Programs Remarks

Uploaded by

Copyright:

Available Formats

Index: Sr. No. Programs Remarks

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Index: Sr. No. Programs Remarks

Uploaded by

Copyright:

Available Formats

INDEX

Sr. No. Programs Page Remarks

1 PHP Code to display today’s date in dd-mm-yyyy format. 1

echo "Today is " . date("d-m-Y") . "<br>";

for($i = 2; $i < $MyNum; $i++) {

echo $MyNum." is a prime number.";

echo $MyNum." is not a prime number.";

// if and else if to generate first two numbers

// Recursive Call to get the upcoming numbers

usort($data, function ($a, $b) {

<table width="200" border="1">

// Check if the form was submitted

<form action="login.php" method="post">

<form action="insert.php" method="post"> Name <input type="text" name="fname"

<?php$con= mysqli_connect("localhost","root","root","srikanth"); if (!$con)

die("Could not connect:'. mysql_error());

die('Could not connect: '. mysql_error());

$sql="INSERT INTO login (name, password, email, phno) VALUES

echo "I record added";

echo "You want to register another user, Click <a href='register.html">here</a>";

// Store the text in a text file

file_put_contents($file, $data, FILE_APPEND);

// Display the stored text

// Collect form data

// Make an AJAX request

<div id="result"></div>

// Clear previous error messages

<p style="text-align: center; font-family: cursive;">Pathan-Bollywood Movie</p>

<p style="text-align: center; font-family: cursive;"> John Wick-Hollywood Movie</p>

<p style="text-align: center; font-family: cursive;"> RRR-Pollywood Movie</p>

// Add 'checked' class to clicked star and previous stars

class App extends Component {

// Set a user input value

// Add item if user input in not empty

// Add a user value to list

// Function to delete item from list use id to delete

// Filter values and leave value which we need to delete

// Update list in state

export default App;

<!-- This is the element where our entire

You might also like

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.