0% found this document useful (0 votes)

89 views

WEB PROGRAMMING PRACTICAL Ap

The document describes creating different HTML forms and elements. It includes code to create a college timetable using HTML table tags, a registration form with various input fields, and a sign up and sign in form. It also includes CSS code to add styling and questions about HTML forms and elements.

Uploaded by

Saiyed mo sadab

Available Formats

Download as PDF, TXT or read online on Scribd

0% found this document useful (0 votes)

89 views

WEB PROGRAMMING PRACTICAL Ap

Uploaded by

Saiyed mo sadab

Available Formats

Download as PDF, TXT or read online on Scribd

You are on page 1/ 57

PRACTICAL No: 1

EXERCISE:
1. Make your college time table using HTML table.

<!DOCTYPE html>
<html lang="en">
<head>
<title>College Timetable</title>
<style>
table {
width: 100%;
border-collapse: collapse;
}
th, td {
border: 1px solid black;
padding: 8px;
text-align: center;
}
th {
background-color: #f2f2f2;
}
</style>
</head>
<body>

<h2>College Timetable</h2>

<table>
<tr>
<th>Time/Day</th>
<th>Monday</th>
<th>Tuesday</th>
<th>Wednesday</th>
<th>Thursday</th>
<th>Friday</th>
</tr>
<tr>
<td>8:00 - 9:30</td>
<td>web programming </td>
<td>toc</td>
<td>AJP</td>
<td>M$I</td>
<td>IPDC</td>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
</tr>
<tr>
<td>9:30 - 11:00</td>
<td>AJP</td>
<td>IOT</td>
<td>M$I</td>
<td>WEB PROGRAMING</td>
<td>TOC</td>
</tr>
<tr>
<td>11:00 - 12:30</td>
<td>AJP</td>
<td>WEB PROGRAMMING</td>
<td>TOC</td>
<td>IPDC</td>
<td>AJP</td>
</tr>
<tr>
<td>12:30 - 2:00</td>
<td colspan="5">Lunch Break</td>

</tr>
<tr>
<td>2:00 - 3:30</td>
<td>TOC</td>
<td>IPDC</td>
<td>WEBPROGRAMMING</td>
<td>IOT</td>
<td>IOT</td>
</tr>
</table>

</body>
</html>

OUT PUT:

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
QUIZ:
1. What does HTML stand for?

HTML stands for Hypertext Markup Language. It is the standard markup language
used for creating web pages and web applications

2. How is document type initialized in HTML5.0?

In HTML5.0, the document type declaration, also known as the DOCTYPE

declaration, is initialized as follows:
<!DOCTYPE html>

3. Which HTML tag is used to make a text bold?

The HTML tag used to make text bold is the <strong> tag.
Example:
<p>This is <strong>bold</strong> text.</p>

4. Which HTML tag is used to make an un-ordered list?

The HTML tag used to create an unordered list is the <ul> tag.
example:
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
5. Which character indicates closing of a tag?
The character that indicates the closing of an HTML tag is the forward slash (/). It is used
right after the tag name to mark the end of the tag. For example:
<p>This is a paragraph.</p>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
PRACTICAL NO - 2
Exercise:
1. Create a Registration Form.
Code:

<html>
<head>
<title>Registration Form</title>
<style> body{ background-color:powderblue;
</style>
</head>
<body
<h2>Registration From</h2>
<form>
<lable>Enter full Name:</lable>
<input type="text" id="fname"> <br><br>
<lable>Email id:</lable>
<input type="text" id="fname"> <br><br>
<lable>password:</lable>
<input type="password" id="fname"> <br><br>
<label for="date"> Enter Birth date:-</label>
<input type="date" id="date"> <br> <br>
<label for"text"> Gender:-</label>
<label for="text">Male</label>
<input type—"radio" id="male" value—"Male">
<label for="text">Female</label>
<input type="radio" id="female" value="Female">
<label for="text">Others</label>
<input type="radio" id="others" value="Others">
<br><br>
<input type="submit">
<input type="reset">
</from>
</body>
</html>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
OUTPUT:

Registration From
Enter full Name:

Email id:

password:

Enter Birth date:- dd-mm-yyyy

Gender:- Male Female O Others O

2. Create a Sign-up Form.

Code:

html> <html>
<head> <title>Registration Form</title>
<style> body { background-
color:powderblue;

<body>

<form>
<center>
<h2>Sign-up From</h2> <lable>Enter full
Name:</lable> <input type="text"
id="fname"> <br><br>
<lable>Email id:</lable>
<input type="text" id="fname"> <br><br>
<lable>password:</lable>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
<input type="password" id="fname"> <br><br>
<lable>confirm password</lable>
<input type="password">
<br><br>
<input type="submit">

</body>

</html>

3. Create a Sign-in Form.

Code:

<html>
<head>
<title>Registration Form</title>
<style> body {
background-
color:powderblue;</style
> </head><body>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
<form>
<center>
<h2>Sign-in From</h2>
<lable>Username:</lable> <input type—"text"
id="fname"> <br><br> <lable>password:</lable>
<input type="password" id="fname"> <br> <h6
style="color:red; ">forgot password?</h6>
<input type="submit"></html>

•3 Quiz:
1. How do you add a text area to a form?
To add a text area to a form in HTML, the <textarea> element is used.

<form>
<label for="message">Message:</label>
<textarea id="message" name="message" rows= "4 " cols="50"></textarea> </form>

2. What attribute do you set to limit the number of letters in a text field?
To limit the number of characters in a text field in HTML, the maxlength attribute is used.

<form>
<label for="username">Username:</label>
<input type="text" id="username" name="username" maxlength="20">

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
</form>

PRACTICAL - 3
Exercise:

l. Design a webpage for a NEWS site using an HTML tag DIV that includes positioning
margin and padding properties of CSS.

Code:
html>
<html lang="en">
<head>
< title>Breaking News</title>
<style> body { padding: 10px;
margin: 10px; border: 2px
solid black; display: flex;
flex-wrap: wrap;

. cl { text-align: center;
color: red; border: 5px
outset red; width:
100%;

. news-item { flex: 1; margin: 3px; max-width: calc (50% 2Øpx) ; / * Set maximum width
to 50% of the container minus margins * /

. red-button {
background-color: red;
color: white; padding:
10px 20px; border:
none; border-radius:
5px; text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
< / style>
</head>
<hl class='
<div class="news-item">
<img src="https://tse4.mm.bing.net/th?id=OIP.7-

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
Heavy <span style="color:red; ">Rainfa11</span> in south Delhi, Lorem ipsum dolor sit
<br>amet, consectetur adipisicing el it . . <b> we are live click to join. . .</b></p>
<button class="red-button">LIVE</button>
</div>

<div class="news-item">
<img
src="https://tse1.mm.bing.net/th?id=OIP.300RpMSht1uHbewpVdKuwHaE8&pid=Api&P=0&h=1
8Ø" alt="Accident" width="75%" height="60%">
<p><span style="color:red; ">15th Accident in the last 3 days</span> in south Delhi, Lorem<br> ipsum
dolor sit amet, consectetur adipisicing el it . .
<button type="button">know more. .</button> </div>

<div class="news-item">
<img src="https://tse4.mm.bing.net/th?id=OIP.7-

">Rainfa11</span> in south
Delhi, Lorem ipsum dolor sit amet, consectetur adipisicing elit. .
<button type="button">know more. .</button> </div>

< / html >

Output:

BREAKING NEWS

Heavy Rainfall in south Delhi, Lorem ipsum dolor sit Heavy Rainfall in south Delhi, Lorem ipsum dolor sit amet, amet, consectetur adipisicing elit... 15th Accident in the
last 3 days in south Delhi, Lorem consectetur adipisicing elit... ipsum dolor sit amet, consectetur adipisicing elit...
we are live click to join.„ know more..
know more..

LIVE

2. Creating hovering effect using HTML CSS.

<meta charset="UTF-8"> <meta name="viewport"

content="width=device-width, initial-scale=1.O">

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
<title>Hover Effect</title>
<style>
/ * CSS for the hover effect */
.box { width: 200px; height: 200px;
background-color: blue; transition:
background-color 0.3s ease;

/ * Change background color on hover */

.box:hover { background-
color: red;

</style>
</head>

Try Hovering

</html>

Output:

Try Hovering Try Hovering

(before) (after)
3. table cell and link hover effect
<html
<head>
<meta charset="UTF-8">

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
<meta name="viewport" content="width=device-width,
<title>Hover Effects</title>
<style> table { border-
collapse: collapse; width:
100%;
table, th, td { border: Ipx
solid black; padding:
8px;
td:hover { background-color:
lightgray;
a.hover-effect:hover {
color: red;
</style>
</head>
<table>
<tr>
<td>HTML</td>

<td>JS</td>
<tr>
<td>SQL</td>
<td>React</td>
<td>Nodejs</td>
<tr>
<td>Mongodb</td>
<td>Oracle</td>
<td>Expressjs</td>
</table>

href="#" class="hover-effect">Hover Over Me</a></p>

</html>

Output:

HTML css JS

SQL React Nodejs

Mongodb Oracle Expressjs

Quiz:-

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
1. What does CSS stand for?

CSS stands for Cascading Style Sheets.

2. Which HTML tag is used to define an internal style sheet?

The section of an HTML document.

3. Which CSS property is used to change the text color of an element?

The CSS property used to change the text color of an element is color. You can use this property to specify the
color of text content within an HTML element.
color: blue;
/* Sets the text color of paragraphs to blue */

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
PRACTICAL - 4

•• Exercise:

1. Create basic Table with bootstrap.

<html
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.O">
<title>Bootstrap Table</title>

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
</head>
<bodp
<div class="container">
<h2>Simple Bootstrap Table</h2>
<table class="table">
<thead>

</thead>

<tr>
<th scope="row">l</th>
<td>John Doe</td>
<td>30</td>
</tr>
<tr>
<th scope="row">2</th>
<td>Jane Smith</td>
<td>25</td>
</tr>
<tr>
<th scope="row">3</th>
<td>James Johnson</td>
<td>40</td>
</tr>

</table>

</html>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
Output:

Simple Bootstrap Table

ID Name Age
1 John Doe 30
2 Jane Smith 25
3 James Johnson 40

2. Create List with bootstrap.

html>

<head>

<meta name="viewport" content="width=device-width,

<title>Bootstrap List</title>

</head>

<h2>Bootstrap List</h2>

<li class="list-group-item">ltem 1</li>

</html>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
Output:

Bootstrap List
Item I
Item 2
Item 3
Item 4
Item 5

3. Create Button with bootstrap.

html>

<head>

<meta name="viewport" content="width=device-width, initial-scale=1.O">

<title>Bootstrap Button</title>

</head>

<h2>Bootstrap Button</h2>

<button type="button" class="btn btn-primary">Primary Button</button>

</html>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
Output:

Bootstrap Button
Primary Button
1. Bootstrap 3 is mobile first?

Yes, Bootstrap 3 was designed with a "mobile-first" approach, meaning it prioritizes

styling for smaller screens like mobile devices and then scales up for larger screens like
desktops.

2. Which class provide a responsive fixed width container?

In Bootstrap 3, the class .container provides a responsive fixed-width container.

3. Which class provide a full width container, spanning the entire width of viewport?
In Bootstrap 3, the class .container-fluid provides a full-width container, spanning the
entire width of the viewport.

4. The bootstrap grid system is based on how many columns?

The Bootstrap grid system is based on 12 columns.

5. Which class adds zebra strips to a table

In Bootstrap 3, the class .table-striped adds zebra striping to a table, which means it
applies alternating background colors to rows to enhance readability.

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
PRACTICAL - 5
Exercise :
1. Write a JavaScript program that prints first n Fibonacci numbers. Here n will be inserted by
the user.
Ans:
<html>
<head>
<title> Fibonacci Series in JavaScript </title>
</head>
<bodp <script> var nl = O, n2 = 1, next num, i; var num = parselnt
(prompt (" Enter the limit for Fibonacci Series ")); document.write(
"Fibonacci Series: "); for ( i = 1; i num; i++){ document.write (" <br> "
+ nl); next num = nl + n2; nl = n2; n2 = next num;

</scri

</html>

C G) File I C:/Users/Admin/Desktop/fibonacci.html
Fibonacci Series:
o
2. Write JavaScript code that displays the text "SAL Education Campus" with increasing
font size in interval of 50ms in blue color. When font size reaches to 50px it should
stop. Ans:
<html>
<body style="background-color:#9EDDFF";>
<center>
<div id="h"></div> <script> var v = 0, f =
1,t="SAL Education Campus",color; function a()

v+=5,color="blue"; document.getElementByld("h").innerHTML = "<hl

style=\"font-size: margin: Opx; color : "+color+"\"><b> "+t+"</b></hl>";
f = O, t="SAL Education Campus";
c(); function c()

setTimeout(a,100);

c();
</script>
</center>

</html>
SAL Education Campus

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
3. Write a JavaScript function to check whether a given value is an valid url or not. Ans:
html>

<head>
<title>URL Validation</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
</head>
<body>
<center>
<h3> URL Validator</h3>
<input type="text" id="urllnput" placeholder="Enter a URL">
<button onclick="checkURL()">Check URL</button>
id="result"></p>
</center>
<script> function
isValidURL(url) {
// Regular expression for a simple URL pattern (http/https/ftp/ftps)
const urlPattern = /A (https? I ftp I ftps):\/\/\S+$/i;
return urlPattern.test(url);

function checkURL() { const inputURL =

const
resultElement = document.getElementByld( I result');

if (isValidURL(inputURL)) {
resultElement.innerText = "Valid URL";
} else { resultElement.innerText = "Invalid
URL";

</script>

</html>

URL Validator

Valid URL

4. Write a JavaScript program that work as a trim function (string) using regular
expression. Ans:
html>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
<html>
<head>
<title>Custom String Trim</title>
</head>

<center>
<h2>Trim Function</h2>
<input type="text" id="inputString" placeholder="Enter a string with spaces">
<button onclick="trimString()">Trim</button>
id="trimmedResult"></p>
</center>
<script> function
customTrim(inputString) {
// Use a regular expression to remove leading and trailing whitespace return
I \S+$/g,

function trimString() { const inputElement = document.getElementByld( I

inputString'); const trimmedResultElement =
document.getElementByld('trimmedResult'); const inputString =
inputElement.value; const trimmedString = customTrim(inputString);
trimmedResultElement.innerText = trimmedString;

</script>

</html>

Trim Function

Rohit Sharma

5. Write a JavaScript function to check whether a given value is IP value or not. Ans:
html>

<head>
<title>lP Address Validator</title>
<script> function validatelP() { var ipAddress =
document.getElementByld('ipAddress').value;

var pnode=document.getElementByld("res"); if
(ipPattern.test(ipAddress)) {
pnode.textContent="lP Address is Valid. ";

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
} else { pnode.textContent="lP Address is
Invalid.";

</script>
</head>

<center>
<h1>lP Address Validator</hl>
<form>
<label for="ipAddress">Enter IP Address:</label>
<input type="text" id="ipAddress" name="ipAddress" required>
<button type="button" onclick="validatelP()">Validate</button>
</form> id="res"></p>
</center>
</body>
</html>

IP Address Validator
Enter IPAddress: 192.188.455.255
Address is

Quiz:
1. Inside which HTML element do we put the JavaScript?
Ans: JavaScript code is placed inside the <script> element in HTML.

2. How do you write "Hello World" in an alert box? Ans: To display "Hello World" in an alert box
use syntax World");

3. How do you create a function in JavaScript?

Ans: A function in JavaScript is created using the 'function s keyword, like this: function
myFunction() {}.

4. How do you round the number 7.25, to the nearest integer?

Ans: To round 7.25 to the nearest integer, you can use Math.round(7.25);

5. Which operator is used to assign a value to a variable? Ans: The assignment operator in
JavaScript is z.

6. Is JavaScript case-sensitive?
Ans: Yes, JavaScript is case-sensitive.

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
PRACTICAL - 6
Exercise:
1. Perform complete form validation name, email, phone number, checkbox etc using
JavaScript.
Ans:
<html>
<head>
<title>Validation form</title>
</head>
<body>
<center style="border:2px solid black; padding:20px; width:500px; margin: 100px
450px;">
<h2>Validation Form</h2>
<form id="myForm" onsubmit="return validateForm()">
<div style="padding: 10px;">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<div id="nameError"></div>
</div>
<div style="padding: IOpx;">
<label for="email">Email:</label>
<input type="email" id="email" name="email">
<div id="emailError"></div>
</div>
<div style—"padding: 10px;">
<label for="phone">Phone:</label>
<input type—"tel" id—"phone" name—"phone">
<div id="phoneError"></div>
</div>
<div style="padding: IOpx;">
<input type="checkbox" id="checkbox" name="checkbox">
<label for="checkbox">Agree with terms and conditions.</label>
<div id="checkboxError"></div>
</div>
<button type="submit">Submit</button>
</form>
</center> <script> function validateForm() { var name =
document.getElementById('name').value; var email =
document.getElementById('email').value; var phone =
document.getElementById('phone').value; var checkbox =
document.getElementById('checkbox').checked; var nameError —
document.getElementById('nameError'); var emailError =
document.getElementById('emailError'); var phoneError =
document.getElementById('phoneError'); var checkboxError =
document.getElementById('checkboxError'); var isValid = true; if

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
(name == ") { nameError.innerText = 'Name is required.'; isValid
false;
} else { nameError.innerText
—

if (email emailError.innerText 'Email

is required.'; isValid = false;
} else if (!/\S+@\S+\.\S+/.test(email)) {
emailError.innerText = 'Email is invalid.',
isValid = false; } else { emailError.innerText
—

if (phone phoneError.innerText — 'Phone

number is required.'; isValid = false; } else if
{ phoneError.innerText =
'Phone number is invalid.'; isValid = false; } else {
phoneError.innerText

if (!checkbox) { checkboxError.innerText = 'Checkbox must

be checked.' , isValid = false; } else {
checkboxError.innerText —

return isValid;

</script>
</body>
</html>

Output:

Validation Form
Name: John

Please include an in the email address. •johnl 234' is missing an

C) Agree with terms and conditions-
Submit

2. Design a login form using HTML & JavaScript with following validations on
• username and password fields.
• Password length must be 6 to 12 characters
• Username should not start with _, @ or number. • Phone number must be 10 digit
start with 6/7/8/9
Ans:

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
<html
<head>
<title>Login Form</title>
<script> function validateForm() { var username =
document.getElementById("username").value; var password —
document.getElementById("password").value; var phoneNumber
= document.getElementById("phone").value; var
A
usernamePattern = / [a-zA-Z] [a-zA-Z0-9] * $1; var
passwordPattern = JA. {6, 12} $1; var phonePattern {9}
$1;

if { alert("Username is invalid. It
should not start with @, , or a number."); return false;

if (!password.match(passwordPattern)) {
alert("Password must be 6 to 12 characters long.
"); return false;

if (!phoneNumber.match(phonePattern)) { alert("Phone number is invalid. It

must be 10 digits and start with 6, 7, 8, or return false;

</script>
</head>
<body>
<center style="border:2px solid black; padding:20px; width:500px; margin: 100px
450px;
<h2>Login Form</h2>
<form onsubmit="return validateForm()">

<div style="padding: 10px;">

<label for="username">Username:</label>
<input type="text" id="username" name="username" required><br>

<div style="padding: 10px;">

<label for="password">Password:</label>
<input type="password" id="password" name—"password" required><br>
</div>
<div style="padding: IOpx;">
<label for="phone">Phone No</label>
<input type="text" id="phone" name="phone" required><br>
</div>

<input type="submit" value="Login">

</form>
</center>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
</body>
</html>

Output :
X Login Form

ons%20(1),html

This page says

Phone number is invalid. It must be 10 digits and start with 6, 7, 8, or 9.

Usemame:

Password:

PhoneNo
Login

Quiz:
1. How to use external JavaScript file?
Ans: To use an external JavaScript file:
Create a js file with your JavaScript code.
Link it in your HTML with <script src="filename.js"> </script>
You can now use the JavaScript functions and variables in your HTML.
2. What is the working of timers in JavaScript?
Ans: Timers in JavaScript are functions that schedule code execution at specific times
or intervals. setTimeout runs code once after a delay setlnterval runs code repeatedly
at regular intervals, and requestAnimationFrame is used for smooth animations.

3. How can you convert the string of any data base to an integer in Javascript?
Ans: You can convert a string to an integer in javascript using parselnt() or Number().

4. What are the different data types present in JavaScript?

Ans: JavaScript has two main data type categories:
Primitive Data Types:
Number
String
Boolean
Undefined
Null
Symbol (ES6)

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
Biglnt (ESII)

Reference Data Types: e

Object
Array
Function

These data types cover the essentials for working with JavaScript.

5. Explain Implicit type coercion in JavaScript.

Ans: Implicit type coercion in JavaScript is the automatic conversion of data types
during operations. For example, JavaScript can convert between strings and numbers
or evaluate truthiness. This can lead to unexpected behavior, so be cautious and use
strict equality (==) to avoid it.

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
PRACTICAL - 7
Exercise :
1. Write a PHP program to print alphabet triangles.

ABA
ABCBA ABCDCBA Ans :
<?php
$height = 4; // Change the height of the triangle as needed for ($i — 0; $i

< $height; $i++) {

for ($j = $height - $i; $j > 1; $j--) { echo

for ($j 0; $j <= $i; $j++) { echo chr(65 + $j);

for ($j $i - 1; $j 0; $j--) { echo chr(65 + $j);

echo "<br>"; echo PHP EOL ;

Output:

ABA
ABCBA ABCDCBA

2. Write a PHP program to print the factorial of a number.

Ans:

<?php function factorial($n) { if($n

0) { return 1;
} else { return $n * factorial($n - 1);

$number = 5;

if ($number < 0) { echo "Factorial is not defined for negative

numbers." ,
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
} else {
$result = factorial($number); echo "Factorial of
$number is $result";

Output:

Factorial of 5 is 120

3. Write a PHP program to check Armstrong numbers

Ans:

function isArmstrongNumber($number) {

$numStr = (string)$number;
$numDigits = strlen($numStr);

$sum — 0;
for ($i = 0; $i < $numDigits; $i++) {
$digit — (int)$numStr[$i];
$sum += pow($digit, $numDigits);

if($sum — $number) { return true;

} else { return false;

$numberl = 153;
$number2 370; $number3 = 371;

if (isArmstrongNumber($numberl)) { echo $numberl . " is an

Armstrong number.\n.<br>";
} else { echo $numberl is not an Armstrong number.\n.<br>";

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
if (isArmstrongNumber($number2)) { echo $number2 . " is an
Armstrong number.\n.<br>";
} else { echo $number2 . " is not an Armstrong number.\n.<br>";

if (isArmstrongNumber($number3)) { echo $number3 is an

Armstrong number.\n.<br>";
} else { echo $number3 . is not an Armstrong number.\n.<br>";

153 is an Armstrong number. .

370 is an Armstrong number.
371 is an Armstrong number.
4. Write a PHP program to check palindrome numbers.

Ans:

<?php function isPalindrome($number) {

$originalNumber = $number; $reverseNumber = 0;

while ($number > 0) {

$remainder = $number % 10;
$reverseNumber = $reverseNumber * 10 + $remainder;
$number = (int)($number / 10);

if ($originalNumber == $reverseNumber) { return true; // It's a

palindrome
} else { return false;

$numberl = 121;
$number2 = 12321; $number3 — 45678;

if (isPalindrome($number1)) { echo $numberl is a palindrome

number.\n.<br>";
} else { echo $numberl . is not a palindrome number.\n.<br>";

if (isPalindrome($number2)) { echo $number2 . " is a palindrome

number.\n.<br>";
} else { echo $number2 . " is not a palindrome number.\n.<br>";

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
if (isPalindrome($number3)) { echo $number3 is a palindrome
number.\n.<br>";
} else { echo $number3 . is not a palindrome number.\n.<br>";

121 is a palindrome number.

12321 is a palindrome number.
45678 is not a palindrome number. .
5. Write a PHP script for login authentication.
Ans:
<?php
$valid username = "username";
$valid_password "password";
$username — $password
$error =

if METHOD"] "POST") {

$username — $ POST["username"]; $password = $ POST["password"]; if ($username

$valid username && $password — $valid_password) {

header("Location: secure_page.php"); exit();

} else {

$error — "Invalid username or password. Please try again." ,

html>
<html>
<head>
<title>Login Page</title>
</head>
<body>
<h2>Login</h2>
<form echo $ SELF"]•
<label for="username">Username:</label>
<input type="text" id="username" name="username" value="<?php echo $username;
?>" required><br><br>

<label f0F"password">Password:</label>
<input type="password" id="password" name="password" required><br><br>

<input type="submit" value="Login">

</form>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
<p style="color: red;"><?php echo $error; ?></p>
</body>
</html>
Login page

C CD localhosVanswerS.php

password:

Invalid username or password. Please try again.

6. Design an html form which takes username and password from user and validate
against stored username and password in file.

Ans:

Index.html

html>
<html>
<head>
<title>Login Form</title>
</head>
<body>
<h2>Login Form</h2>
<form action="validate.php" method="post">

<label for="username">Username:</label>
<input type="text" id="username" name="username" required><br><br>

<label for="password">Password:</label>
<input type="password" id="password" name="password" required><br><br>

<input type="submit" value="Login">

</form>
</body> </html>

validate.php

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
<?php

$credentials file = 'credentials.txt';

if METHOD"] "POST") {
$username — $ POST ["username"];
$password = $ POST ["password"];

$stored_credentials = flle($credentials file,

FILE IGNORE NEW LINES I FILE SKIP EMPTY LINES);

if ($stored_credentials !== false) { foreach ($stored_credentials as $line) {

list($stored_username, $stored_password) = explode(':', $line); if ($username
— $stored username && $password
$stored_password) {

echo "Login successful! " • exit();

echo "Invalid username or password. Please try again. ",

C C) localhost,ftndex.html

Password:

localhost/validate.php

C (D localhost/validate.php Login

successful!

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
7. Write a php code to calculate the number of days between to two input dates if the
difference is even number then render background color as blue or red.

Ans:
<?php
$startDate = isset($_POST['start date']) ? $ POST['start_date'] : null;
$endDate isset($ POST['end date']) ? $ : null;
$backgroundColor if ($startDate &&

$endDate) { $startTimestamp =

strtotime($startDate); $endTimestamp

strtotime($endDate);

if ($startTimestamp !== false && $endTimestamp !—= false) {

$differenceInDays = round(($endTimestamp - $startTimestamp) / (60 * 60 * 24));

// Check if the difference in days is even or odd if

($differenceInDays % 2
$backgroundColor — 'blue';
} else {
$backgroundColor — 'red';

html>
<html>
<head>
<title>Date Difference</title>
</head>
<body>
<h2>Calculate Date Difference</h2>
<form method="post" action="<?php echo $ SERVER['PHP SELF']; ?>">
<label for="start date">Start Date:</label>
<input type="date" id="start date" name="start date" required><br><br>

<label for="end date">End Date:</label>

<input type—"submit" value="Calculate">

</form>

<?php if ($backgroundColor): ?>

NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
<div style="background-color: <?php echo $backgroundColor; padding: 10px;
margin-top: 20px;">
<?php echo "Difference in days: $differenceInDays; ?>

<?php endif;

</html>

Calculate Date Difference

Start Date: 20-10-2023 6

End Date:

Calculate

Calculate Date Difference

Start Date: 10-10-2023

End Date:

Calculate

Quiz :
1. All variables in PHP start with which symbol?
In PHP, all variables start with the dollar symbol ($) symbol.

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
PRACTICAL - 8
EXERCISE:
1. Perform keep me logged checkbox checked using cookie.
->INPUT:
Login.html
< ! DOCTYPE html >
<html>
<head>
< title>Login</tit1e>
</head>
< body>
<h2>Login</h2>
< form method="post" action=" login .
< label ">Username : < / label >
< input type=" text" id="username " name—
I'username" required><br><br>
< label for="password">Password:</IabeI>
< input type="password" id="password" sword"
required><br><br>
< input type=" checkbox" id=" keep me logged" name="
keep me logged" >
< label for="keep me logged" >Keep me logged in</

< input type=" submit"

< / form>
</body> </html>
Login.php: < ?php if ($ SERVER ["REQUEST METHOD"] - -
"POST")
$username $ POST [ "username
$password $ POST ["password"] ;
$keepMeLogged isset ($ POST ["keep me logged"] )
$ POST "keep me logged" ] " on "
if ($username "Virat" & & $password
"12345678" )
// Authentication is successful if
($keepMeLogged) {
// Set a cookie to remember the user setcookie
("username" , $ username , time ( ) * 60 * 24 * 30,
setcookie ( "password" , $password, time ( )
* 60 * 24 * 30 ,
// Redirect to a secure page or user dashboard
header ("Location: page 1 .php") • exit ( ) ;
// Invalid username or password echo "
Invalid username or password.
Please try again. "
else { echo 'Invalid username or password. Please try
again. " ;
Pagel.php: < ?php if (isset ($ COOKIE [
"username"] ) && isset ( $ COOKIE ["password"] )
)

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
$username $ COOKIE ["username"] $password = $
COOKIE ["password"]
echo "Welcome back, $username ! " •
header ("Location: login. html ") ; exit ( )
;
Output :
(i)
localhost/php-practice/loggedln.html C O localhost/php-practice/pagel
.php
Login Velcome back, Ihrat!

Username: Virat

Password:

Keep me logged in
Login

2. Write a php script for setting and retrieving your name and email address using cookies.
->INPUT:

set cookies.html
< ! DOCTYPE html >
<html>
<head>
< title>Set
</head>
<body>
<h2>Set Name and Email</h2>
< form method="post" action=" set set .php">
< label for=" name " >Name : < / label >
< input " " name " name=" name " required><br><br>

< label for=" email ">EmaiI

< input " id=" email" name=" email " required><br><br>

< input type=" submit" value="Set Cookies < / form>

</body> < / html >

show_cookies.php

< ! DOCTYPE html >

<head>
< title>Set Cookies</title>
</head>
<body>
<h2>Set Name and Email</h2>
< form method="post" action=" set set .php">
< label for=" name " >Name : < / label >
< input type=" text" id=" name" name=" name " required><br><br>
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
< label for=" email ">EmaiI
<input type="text" id=" email" name=" email " required><br><br>

< input type=" submit" value=" Set Cookies < / form>

</body> </html>

setset.php
< ?php if ($ SERVER ["REQUEST METHOD"] - " POST" )
$ name = $ POST ["name"] ;
$ email S POST ["email"] ;
// Set cookies to store name and email setcookie ("user name" ,
$name, time ( ) + 60 * 60 * 24 * 30,

setcookie ("user email" , $ email, time ( ) + 60 * 60 * 24 *

30,
// Redirect to a page that displays the stored information header (
"Location: show cookies .php") ; exit () ;

Output :
f.- (D localhost/set-cookies/set_cookies.html
Set Name and Email
ame: Virat

Set
Cookies

3.Perform login to logout session handling. None logged in users can not access the page.

->INPUT:

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
< ! DOCTYPE html >
<html>
<head>
< title>Login</tit1e>
</head>
<body>
<h2>Login</h2>
< form method="post" action=" loginphp .php">
< label for="username ">Username : < / label>
<input type=" text" id="username" " required><br><br>

< label for="pas sword " >Password : < / label >

< input type="password" id="password" name="password"
required><br><br>

< input type=" submit" value="Login">

< / form>
</body> < / html >

dashboard. php

<?php session start ( ) ;

if ( !isset ($ SESSION [ 'user' ] ) ) header

( "Location: login . php") ; exit ( ) ;

$username = $ SESSION [ 'user' ] •

< ! DOCTYPE html >

<head>
< title>Dashboard</titIe>
</head>
<body>
<h2>We1come, <?php echo $username; ?>!</h2>
<p>This is the dashboard. Only logged—in users can access this page.</p>
<a href=" logout .
</body> < / html >

logout . php :
< ?php session start ( ) ;

// Unset all of the session variables session unset (

) ;

// Destroy the session session destroy()

;
// Redirect to the login page after logging out header
("Location: login . php") ; exit ( ) ;

Loginphp . php :
< ?php session start () ;

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
Check if the user is already logged in if (isset
($ SESSION C ' user' ] ) ) header ( "Location :
dashboard . php") ; exit () ;

if ($ SERVER [ 'REQUEST METHOD' ] - 'POST' )

$username = $ POST [ 'username' ] ;
$password = $ POST [ 'password' ] ;

// Replace this with your actual authentication logic if ($username

'virat' && $password — ' 12345678 ' ) $ SESSION [ 'user' ] - $username;
// Set a session variable to mark the user as logged in header
("Location: dashboard.php") ; exit ( ) ;

$error = " Invalid username or password. Please try again. " ;

Output :

(D localhost,/loggedout/login.html

password:
Login

C O localhost/loggedout/dashboard.php

Welcome, virat!
This is the dashboard. Only logged-m users can access
this page.

4.Write a php program to greet the user based on time.

->INPUT:

< ?php date default timezone set ("Asia/ Kolkata") ;

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
$currentHour = date ("G") ;

if ($currentHour >= 5 && $currentHour < 12) {

$greeting = "Good morning" ; elseif ($currentHour >= 12 &&
$currentHour < 18) $greeting — "Good afternoon" ; elseif
($currentHour >= 18 && $currentHour < 24)
$greeting = "Good evening" ;

$greeting = "Good night" ;

< ! DOCTYPE html >

<html>
<head>
< title>Greeting</tit1e>
</head>
<body>
<h2><?php echo $greeting; User ! </h2>
</body>
< / html >
Output :
Greeting

localhost/time.php

Good afternoon, User!

5.Write a php code to upload file on server and display file details on the page (ex. file name,
extension,file size)

->INPUT:

Index . html

< ! DOCTYPE html >

< html >
<head>
< title>FiIe
</head>
<body>
<h2>Up10ad a File</h2>
< form php" method="post" enctype= "mul t i
part / fo rm—data " >
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
< input type=" file" name=" fileToUp10ad" id="
fileToUp10ad" required><br><br>
< input type=" submit " value="Up10ad File" >
< / form>
< / body>
< / html >

Upload. php

< ?php if ($ SERVER ["REQUEST METHOD"] " POST" isset

($ FILES ["fileToUpIoad"] ) )
$ file — $ FILES ["fileToUp10ad"] ;

$file name $ file [ "name " ] ;

$ file temp — $ file ["tmp name"] ;
$file size $ file [ " size"] ;
$ file extension = path info ( $ file name,
PATHINFO EXTENSION) ;

$upload directory — "uploads/" ,

$unique file name — uniqid ( )
$ file extension;
$ file destination — $upload directory
$unique file name;

if (move uploaded file ( $ file temp, $ file

destination) )
echo "File uploaded successfully! <br>" ;
echo "File name : $ file name
echo "File extension: $ file extension
"<br>" ;
echo "File size: $ file size bytes
else { " ;
echo "File upload failed. "
Output :
File Upload

C G) localhost/index.html CD

Upload a File

Choose File WD Practic...116010.docx

Upload File
Q) ENG 17•.50

Type here to search 23-10-2023

localhowupload.php
o x

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
(D localhost/upload.php
+
File uploaded successfully! CD

File name: WD Practical 7

File .221263116010.docx extension: docx size:
File 783391 bytes p

1 r.50
@ Q)) ENG
Type here to search 23-10-2023

6. Create a web page which shows the use of Session. (Create, Retrieve, Modify Delete and Destroy
Session Variables)

->INPUT:

< ?php session start ( ) ;

if (isset ($ POST set Session' ] ) )

$ SESSION [ 'user' ] $ POST [ 'username' ]

if (isset ($ POST 'modifySession' ] )

$ SESSIÖN[ 'user' ] - ' Modi f i ed User' ;

if (isset ($ POST [ deleteSession' ] )

unset ($ SESSION [ 'user' ] ) ;

if(isset ($ POST [ ' destroySession '

session destroy() ;
session start ( ) ;
$sessionData = isset ($ SESSION [ 'user' ] )
SESSION [ 'user' ] ' Session variable is not set. '

< ! DOCTYPE html >

< html >
<head>
< title>Session Example</title>
</head>
<body>
<h2>Session Example</h2>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
< form method="post">
< label for="username " >Username : < / label >
< input type="text" id="username" name="username ">
< input type=" submit" name=" set Session" value=" Set
Session" >
< input type=" submit" name= "modi fySess ion " value="Modify
Session ">
< input type=" submit " name=" deleteSession " value="DeIete
Session" >
< input type=" submit" name=" destroySession " value="Destroy
Session" >
< / fo rm>

<p>Session Data: <?php echo $sessionData;

< / body> < / html
>

Output :

Session Example
Username: Set Session Modify Session Delete Session Destroy Session
Session Data: shailendra

p Type here to search n 44

QUIZ:

1. How do you create a cookie in PHP?

To create a cookie in PHP, use the function with parameters for the cookie name, value,
expiration time, and path.

2. What is the purpose of $_SESSION [l?

SESSIONR is used to store and manage session data in PHP.

3. What is the default execution time set in set_time_limit()?

The default execution time set in is

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
PRACTICAL - 9
EXERCISE:

1. Perform complete user registration i.e. signup, display, update and delete in php.

->INPUT:
regi s tration . php

< ?php session start ( ) ;

if (isset ($ POST [ 'register' ] ) )

$ username $ POST [ 'username' ] ;
$ email $ POST [ ;
$password = $ POST [ 'password' ] • $ SESSION

[ 'user' ] - $ username;

header ( "Location : profile .php") ; exit () ;

< ! DOCTYPE html >

<html>
<head>
< title>User Registration</title>
</head>
<body>
<h2>Sign up</h2>
< form method="post" action=" registration .
<label for=" username " >Username : < /
< input label > type="text"
required><br><br> name="username "

<label
< input for=" email " >EmaiI : < /
required><br><br> label > type=" email" name="
email "
< input
required><br><br> for="password " >Pas sword : < /
label > type="password"
< inputname="password"
value=" Register" >
< / fo rm>
</body> type=" submit" name=" register"
< / html >
Profile . php
< ?php session start ( ) ; if ( !isset ($
SESSION [ 'user' ] ) ) header ( "Location :
registration .php") ; exit () ;

$user — $ SESSION [ 'user' ] ;

< ! DOCTYPE html >

NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
<html>
<head>
< title>User
</head>
<body>
<h2>We1come, <?php echo $user; ? > !
<p>This is your user profile.</p>
</body> < / html >

Output:

Email: [email protected]

Password:
Register

C G) localhost/registration/profile.php

Welcome, virat!
This is your user profile.

2. Write a php code to check whether the given username is already in the "login_tbl" table or not and
display an appropriate message. ->INPUT:

< ?php
$ servername = " local host" ;
$username = "root" ;
$password — $database —

// Create a connection to the database

$connection = mysqli connect ($servername, $ username,
$password, $database) ;

Check the database connection if ( ! $connection) { die

("Connection failed: mysqli connect error ( ) ) ;

if ($ SERVER [ "REQUEST METHOD"] - "POST") $ input

username — $ POSTC 'username'] ;

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
// Query to check if the username exists in the database
$ query - "SELECT * FROM login tbl WHERE username ' $ input
username ' " ;
$ result = mysqli query ($connection, $query) ;

if ($result && mysqli num rows ($result) > 0)

$message — "Username ' $ input username ' is already in use. "

$message — " Username $ input username is available. "

// Close the database connection mysqli close

($connection) ;

< ! DOCTYPE html >

<html>
<head>
< title>Check Username</title>
</head>
<body>
<h2>Check Username
< form method="post" action="<?php echo
$ SERVER ['PH? SELF' ] ;
< label for=" username " >Username : < / label >
< input type="text" id="username" name="username "
required><br><br>
< input type=" submit" value="Check Username" >
< / form>
?php if (isset ($message) ) echo $message; ?></p>
< / body>
< / html >

< input type=" submit" name=" register" value="Register">

< / fo rm>
< / body> </html>

Output :

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
G) localhost/check_username.php

Check Username Availability

Username:
Check Username
Username 'rohit' is available.

here to search lg22

Type 23-10-2023

3. Write a PHP Calculator class which will accept two values as arguments, then add them, subtract
them, multiply them together, or divide them on request

->INPUT:

< ?php class Calculator { private

$valuel; private $vaIue2;

public function construct ($valuel, $va1ue2)

$this—>valuel $valuel; $ this—
>va1ue2 $vaIue2 ;

public function add ( ) return $this—>valuel + $ this—

>vaIue2;

public function subtract ( ) return $ this—>valuel —

public function multiply ( ) return
$this—>valuel * $this—>vaIue2;

public function divide ( ) if ($this—>va1ue2 return

"Division by zero is 0) not allowed. " ;

return $ this—>valuel / $ this—>vaIue2;

/ / Usage
$calculator — new Calculator (10, 5 ) ;

echo " Addition : $calculator—>add ( ) echo " Subtraction :

$calculator—>subtract ( ) echo "Multiplication: "

"<br>" ; echo "Division :

NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
Output :

locath0WCakulator.php

CD
(D localhost/Calculator.php

Addition: 15
Subtraction: 5
Multiplication: 50
Division: 2

Type here to search 23-10-2023

QUIZ:

1. Can I run several versions of PHP at the same time?

Yes, by configuring your web server and using tools like FastCGl or containers, you can run multiple PHP versions
simultaneously on the same server.

2. Can echo in php accept more than 1 parameter?

No, in PHP can only accept one argument at a time.

3. What is the actually used PHP version?

The actually used PHP version can vary depending on the server and configuration. You can determine the
specific PHP version by creating a PHP file with s phpinfo()' and accessing it through a web browser.

4. How do you execute a PHP script from the command line?

To execute a PHP script from the command line, use the command 'php your_script.php', replacing
'your_script.php' with the actual script filename.

5. What is the main difference between require() and require_once()?

'require()' can include a file multiple times, while ensures a file is included only once to prevent
duplication.

6. How is it possible to set an infinite execution time for PHP script?

You can set an infinite execution time for a PHP script using but it's not recommended
for production environments due to potential issues and security concerns.

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
PRACTICAL - 10
EXERCISE:

1. Create your own jQuery AJAX form having a submit button with validation feature

Code :
Index.html

html>
<html>
<head>
<title>jQuery AJAX Form</title>
<script src="https://code.jquery.com/jquery-3.6.O.min.js"></script>
<script src="script.js"></script> </head>

<h2>jQuery AJAX Form</h2>

<label for="email">Email:</label>
<input type="email" id="email" name="email" required><br><br>

<input type="submit" value="Submit">

</form>
<div id="response"></div>

</html>

Script.js

$(document).ready(function() {
$('#myForm').submit(function(e) {
e.preventDefault();

// Client-side validation (you should use more robust validation in production) var
name = var email = $('#email').val();

if (!name I l !email) { fill in all

fields."); return;
// AJAX request to handle form submission
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010
$.ajax({ type: 'POST', url: 'process.php' data:
$(this).serialize(), success: function(response)
{
$(l#response').html(response);

Output :
jQueryAJAX Form

localhosundex.html jQuery AJAX Form

Name:

Email: [email protected]

Submit

2. Write a code to validate user input using jQUERY.

Code :
Index.html

html>
<html>
<head>
<title>Email Validation</title>
<script src=" https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<h2>Email Validation</h2>
<input type="text" id="emaillnput" placeholder="Enter your email">
<button id="validateButton">Validate</button> id="validationMessage"></p>
</body>
</html>
Script.js

$(document).ready(function() {
$('#validateButton').click(function() { var email =

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
if (isValidEmail(email)) {
$('#validationMessage').text('Valid email address.');
} else { email address. l );

function isValidEmail(email) { var emailPattern = /A [a-zA-Z0-9.

return emailPattern.test(email);

Output :
EmailValidation

C) localhost/lndex.html

Email Validation

Valid email address.

p
3. Write a code of jQuery AJAXload content of selected element from a file.

Code :

html>
<html>
<head>
<title>Load Content with jQuerY</title>
<script src="https://code.jquery.com/jquery-3.6.O.min.js"></script> <script >
$(document).ready(function() {
$('#contentSelector').change(function() { var selectedFile =
$(this).val();
$('#loadedContent').load(selectedFile);

</script>
</head>

<h2>Load Content with jQuery</h2>

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
<option value="content1.html">Content l</option>
<option value="content2.html">Content 2</option>
</select>
<div id="loadedContent">
</html>
Output :

Load Content with jQuery

QUIZ:

1. Is jQuery a library for client scripting or server scripting?

jQuery is a client-side scripting library, not for server-side scripting.

2. Is it possible to use jQuery together with AJAX?

Yes, jQuery can be used with AJAX to simplify and enhance the process of making asynchronous
requests to a server.

3. What are the real web applications of AJAX currently running in the market? AJAX is used in real
web applications for features like dynamic content loading, real-time updates on social media,
web-based email, e-commerce, maps, collaboration tools, weather apps, and online chat. These
applications leverage AJAX to provide a seamless and interactive user experience.

4. What are the technologies used by AJAX?

AJAX combines JavaScript (JS), XMLHttpRequest (XHR), the Document Object Model (DOM), HTML,
CSS, JSON or XML, and server-side technologies to enable asynchronous data retrieval and
dynamic updates on web pages.

5. What are the features of jQuery?

Key features of jQuery include DOM manipulation, event handling, AJAX support, animations,
cross-browser compatibility, plugins, chaining, AJAX promises, simplification of common
tasks, extensibility, compact size, documentation, and a large community.

NAME- SAIYED MOHAMMADSADAB

ENROLMENT: 211260107010
NAME- SAIYED MOHAMMADSADAB
ENROLMENT: 211260107010

IP Exit Exam
No ratings yet
IP Exit Exam
40 pages
PartA Programs Full
No ratings yet
PartA Programs Full
20 pages
Iwd Practical Assignments
No ratings yet
Iwd Practical Assignments
24 pages
HTML Full Notes
No ratings yet
HTML Full Notes
17 pages
Manual of Web Programming
No ratings yet
Manual of Web Programming
28 pages
Lab Webd Rachna
No ratings yet
Lab Webd Rachna
57 pages
WT UNIT-I
No ratings yet
WT UNIT-I
143 pages
Lab Webd Shubam
No ratings yet
Lab Webd Shubam
57 pages
SHUBHAM Complete Computer Applications File
No ratings yet
SHUBHAM Complete Computer Applications File
23 pages
BODY Tag: - : HTML Common Tags
No ratings yet
BODY Tag: - : HTML Common Tags
15 pages
HTML Notes
No ratings yet
HTML Notes
13 pages
HTML File by Shivam
No ratings yet
HTML File by Shivam
24 pages
Practical File ON HTML: Maharshi Dayanand University Rohtak
No ratings yet
Practical File ON HTML: Maharshi Dayanand University Rohtak
26 pages
WEB DEVELOPMENT file
No ratings yet
WEB DEVELOPMENT file
8 pages
Web Application and Development: Lab Manual
No ratings yet
Web Application and Development: Lab Manual
52 pages
Web Lab Programs
No ratings yet
Web Lab Programs
41 pages
Introduction To HTML
No ratings yet
Introduction To HTML
14 pages
html questions sem3
No ratings yet
html questions sem3
12 pages
Explain Following CSS Properties
No ratings yet
Explain Following CSS Properties
8 pages
Iwt Practical
No ratings yet
Iwt Practical
18 pages
WP Lab Manual
No ratings yet
WP Lab Manual
101 pages
CTC 101 HTML Questions and Answers
No ratings yet
CTC 101 HTML Questions and Answers
29 pages
web and it technology
No ratings yet
web and it technology
13 pages
HTML XML Applets
No ratings yet
HTML XML Applets
26 pages
Pankajrawat
No ratings yet
Pankajrawat
26 pages
04/11/2024 Gagan Thakral (Abes) 1
No ratings yet
04/11/2024 Gagan Thakral (Abes) 1
40 pages
HTML and Javascript Programs_5830b2d5 3ef2 406e 8572 Eaae6eaf72a9
No ratings yet
HTML and Javascript Programs_5830b2d5 3ef2 406e 8572 Eaae6eaf72a9
22 pages
HTML
No ratings yet
HTML
7 pages
Full Stack
No ratings yet
Full Stack
29 pages
Riiiiii
No ratings yet
Riiiiii
24 pages
QB Solution PDF
No ratings yet
QB Solution PDF
42 pages
HTML-PracticalPrograms 221020 134704
No ratings yet
HTML-PracticalPrograms 221020 134704
13 pages
Homework 2 305
No ratings yet
Homework 2 305
17 pages
HTML Revision
No ratings yet
HTML Revision
6 pages
Website Css
No ratings yet
Website Css
31 pages
Komya Cs
No ratings yet
Komya Cs
52 pages
Write A HTML Page To Print Hello World.: Code
No ratings yet
Write A HTML Page To Print Hello World.: Code
22 pages
Web Ass1
No ratings yet
Web Ass1
16 pages
Muhammad Aamir 2023 CS 566
No ratings yet
Muhammad Aamir 2023 CS 566
39 pages
HTML 1
No ratings yet
HTML 1
11 pages
HTML & XML: Basic Structure of HTML Page
100% (1)
HTML & XML: Basic Structure of HTML Page
7 pages
Web Desighning Lab Manual
No ratings yet
Web Desighning Lab Manual
75 pages
Web Designing Unit 3
No ratings yet
Web Designing Unit 3
28 pages
We Blab Manual
No ratings yet
We Blab Manual
88 pages
HTML Tags: A Very Simple HTML Document
No ratings yet
HTML Tags: A Very Simple HTML Document
8 pages
Untitled Document
No ratings yet
Untitled Document
38 pages
Web Technologies
No ratings yet
Web Technologies
21 pages
Web Programming Lab Manual
0% (2)
Web Programming Lab Manual
73 pages
12TH HTML programs pdf
No ratings yet
12TH HTML programs pdf
28 pages
BSC Vi WT
No ratings yet
BSC Vi WT
24 pages
Chap-2
No ratings yet
Chap-2
52 pages
Internet Web Programming Lab Assignment-1
No ratings yet
Internet Web Programming Lab Assignment-1
10 pages
IT230 - Assignment 2
No ratings yet
IT230 - Assignment 2
10 pages
Full Stack Note
No ratings yet
Full Stack Note
14 pages
File 2 HTML
No ratings yet
File 2 HTML
8 pages
INSEM_SOLUTION_2024 (1)
No ratings yet
INSEM_SOLUTION_2024 (1)
17 pages
Rahul
No ratings yet
Rahul
95 pages
Solution For Excersize1 (Advanced Web Desigining)
No ratings yet
Solution For Excersize1 (Advanced Web Desigining)
9 pages
Lecture 2ABC
No ratings yet
Lecture 2ABC
43 pages
Quick Start Basic HTML and JavaScript
From Everand
Quick Start Basic HTML and JavaScript
Tom Henricksen
No ratings yet
WP HandBook
No ratings yet
WP HandBook
409 pages
Iot Pract
No ratings yet
Iot Pract
29 pages
AJP PRACT Ap
No ratings yet
AJP PRACT Ap
53 pages
1996382480 (1)
No ratings yet
1996382480 (1)
6 pages
zzzzzzzzzzzzzzzzzz
No ratings yet
zzzzzzzzzzzzzzzzzz
3 pages
Upload 4 Documents To Download: Once You Upload An Approved Document, You Will Be Able To Download The Document
No ratings yet
Upload 4 Documents To Download: Once You Upload An Approved Document, You Will Be Able To Download The Document
3 pages
Instagram Mastery For Business EBook NEW PDF
0% (1)
Instagram Mastery For Business EBook NEW PDF
12 pages
Gavotte - F. J. Gossec Sheet Music For Piano (Solo)
No ratings yet
Gavotte - F. J. Gossec Sheet Music For Piano (Solo)
1 page
Surfing The Internet: Plight of The Navigator
No ratings yet
Surfing The Internet: Plight of The Navigator
2 pages
00 Man Ug Ind360 en
No ratings yet
00 Man Ug Ind360 en
194 pages
Airline Reservation System
100% (1)
Airline Reservation System
42 pages
19094144_Report FG101E to FG120G
No ratings yet
19094144_Report FG101E to FG120G
29 pages
G6 DLL Q1 Week 7
No ratings yet
G6 DLL Q1 Week 7
24 pages
Nirmal Dwivedi
No ratings yet
Nirmal Dwivedi
3 pages
SUNWEST ACCT
No ratings yet
SUNWEST ACCT
1 page
Api Notes Step by Step Created by - Bijaya Krushna Rout
100% (1)
Api Notes Step by Step Created by - Bijaya Krushna Rout
8 pages
CB Script
No ratings yet
CB Script
4 pages
DNS SRV Guide 0
No ratings yet
DNS SRV Guide 0
17 pages
Reading Comprehension Test Unit 1 Reading 2
No ratings yet
Reading Comprehension Test Unit 1 Reading 2
3 pages
IvantiEPMM_rn_12.x_1
No ratings yet
IvantiEPMM_rn_12.x_1
39 pages
Cheat Sheet: The SDN Components
No ratings yet
Cheat Sheet: The SDN Components
3 pages
Mathworks Installation Help
No ratings yet
Mathworks Installation Help
40 pages
Installing Carel pgd1 With Pco3
No ratings yet
Installing Carel pgd1 With Pco3
4 pages
DOM Slides
No ratings yet
DOM Slides
38 pages
MV-372 User Manual
No ratings yet
MV-372 User Manual
87 pages
Tour & Travel Management System - PDF - Operating System - Areas of Computer Science
No ratings yet
Tour & Travel Management System - PDF - Operating System - Areas of Computer Science
42 pages
Complete Bug Bounty Cheat Sheet
No ratings yet
Complete Bug Bounty Cheat Sheet
5 pages
User Manual - Step by Step Guide PDF
No ratings yet
User Manual - Step by Step Guide PDF
45 pages
Quizbuilder - Fortify Security Report
No ratings yet
Quizbuilder - Fortify Security Report
9 pages
PM5560 PM5563 PublicFirmwareRevisionHistory v2.7.4
No ratings yet
PM5560 PM5563 PublicFirmwareRevisionHistory v2.7.4
5 pages
Bal Mandir
No ratings yet
Bal Mandir
4 pages
Azure - Storage
No ratings yet
Azure - Storage
2 pages
NOC Call List
0% (1)
NOC Call List
27 pages
Advanced OS Presentation
No ratings yet
Advanced OS Presentation
22 pages