Scribd
Upload
10 views7 pages

Practical 2

The document outlines a practical assignment for a web application that communicates with a server using PHP and JavaScript. It includes HTML and PHP code for two different functionalities: one for suggesting names as the user types and another for searching a cafe menu. The PHP scripts handle user input and return suggestions based on predefined arrays.

Uploaded by

Faisal Khan
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
10 views7 pages

Practical 2

The document outlines a practical assignment for a web application that communicates with a server using PHP and JavaScript. It includes HTML and PHP code for two different functionalities: one for suggesting names as the user types and another for searching a cafe menu. The PHP scripts handle user input and return suggestions based on predefined arrays.

Uploaded by

Faisal Khan
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

Subject Name: Application of AWT (CA218)

StudentID:21102069

Practical 2
1.1 2.1 Create a web Page can communicate with a web server while user
type character in an input field using php.

Code:
1) Put HTML Code
<!DOCTYPE html>
<html lang="en">
<body>
<h1>The XML Http Request Object</h1>
<h3>
Start Typing a name in the input field below
</h3>
<form action="">
First Name : <input type="text" id="txt1" onkeyup="showHint(this.value)">
</form>
<p>Suggestion :<span id="txtHint"></p>
<script>
function showHint(str) {
if (str.length == 0) {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("txtHint").innerHTML = this.responseText;
}
};
Subject Name: Application of AWT (CA218)
StudentID:21102069

xmlhttp.open("GET", "gethint.php?q=" + str, true);


xmlhttp.send();
}
}
</script>
</head>
<body>
<p><b>Start typing a name in the input field below:</b></p>
<form>
First name: <input type="text" onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>

2) Put PHP Code


<?php
//Array with names
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Daniya";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hega";
$a[]="Inga";
$a[]="Johanna";
$a[]="Kitty";
Subject Name: Application of AWT (CA218)
StudentID:21102069

$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tova";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";
//get the q parameter from url
$q =$_REQUEST["q"];
$hint ="";
//lookup all hints from array if $q is different from ""
if($q !==""){
$q = strtolower($q);
$len = strlen($q);
foreach($a as $name){
if(stristr($q,substr($name,0,$len))){
if($hint === ""){
$hint = $name;
Subject Name: Application of AWT (CA218)
StudentID:21102069

}else{
$hint.=",$name";
}
}
}
}
//output "no suggestion" if no hint was found or output correct values
echo $hint ===""?"no suggestion":$hint;

OUTPUT

2.2 Aim: - Create a webpage can communicate with the web server while a
user type character in an input field using the php.
Code:
1. Put HTML Code

<html>
<head><title>Cafe</title>
<body>
<center><u><b><h1>THE JAZZ HOP CAFE</h1></b></u></center>
<center><img src="https://yt3.ggpht.com/a-
/AAuE7mBzN7Mxa4q2vkxS5_Vpf0we_mLuD0CJlqnvBg=s900-mo-cc0xffffffff-rj-k-
no" width="400" height="300" ></center>
Subject Name: Application of AWT (CA218)
StudentID:21102069

</br>
<form action="">
<center>Menu Search Here:</br> <input type="Text" id="text1"
onkeyup="showHint(this.value)" ></center>
</form>
<center><p>OPTIONS: <span id="txtHint"></span></p></center>
<script>
function showHint(str){
var xhttp;
if (str.length==0)
{ document.getElementById("txtHint").innerHTML="";
return;
}
var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
if (this.readyState == 4 && this.status == 200) {
document.getElementById("txtHint").innerHTML = this.responseText;

}
};
xmlhttp.open("GET","p2.php?q="+str,true);
xmlhttp.send();
}
</script>
</script>
</br>
</body>
</html>
2.Put PHP Code
Subject Name: Application of AWT (CA218)
StudentID:21102069

<?php
$drinks = array(
$a[]="americano Rs.80",
$a[]="orange juice Rs.50",
$a[]="cold drink Rs.70",
$a[]="latte Rs.60",
$a[]="cold cocoa Rs.100",
$a[]="hot chocolate Rs.90",
$a[]="iced tea Rs.60",
$a[]="ginger tea Rs.90",
$a[]="lemonade Rs.60",
$a[]="blue lagoon Rs.70",
$a[]="mint mojito Rs.40",
$a[]="strawberry shake Rs.70",
$a[]="litchi juice Rs.80",
$a[]="mango shake Rs.70"
);
$q=$_REQUEST["q"];
$hint1="";
//lookup all hints from array if $q is different from ""
if ($q !=="") {
$q = strtolower($q);
$len=strlen($q);
foreach($a as $drinks) {
if(stristr($q, substr($drinks,0,$len))) {
if($hint1 ==="") {
$hint1 = $drinks;
} else {
$hint1 .= ", $drinks";
}
Subject Name: Application of AWT (CA218)
StudentID:21102069

}
}
}
// Output "no suggestion" if no hint was found or output correct values
echo $hint1 === "" ? "no suggestion" : $hint1;
?>

OUTPUT

You might also like