TYCS Ajax practicals sem VI

T.Y. BSc Computer Science

Practical No:- 10

Practical Name: Create a webpage using Ajax, having a text Box for accepting a number

check whether the number is even or odd using php and dispay the output.

Date: 04/02/2016

Source Code:

Evenno.php

<?php

$q=$_REQUEST["q"]; $hint="";

if ($q !== "")

{

if ($q%2==0)

echo "Even Number";

else

echo "odd Number";

}

else

echo $hint==="" ? "no suggestion" : $hint;

?>

Evenno.html

<html>

<head>

<script>

functionshowHint(str)

{

if (str.length==0)

{

document.getElementById("txtHint").innerHTML="";

return;

}

varxmlhttp=new XMLHttpRequest();

xmlhttp.onreadystatechange=function()

{

if (xmlhttp.readyState==4 &&xmlhttp.status==200)

{


document.getElementById("txtHint").innerHTML=xmlhttp.responseText;

}

}

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

xmlhttp.send();

}

</script>

</head>

<body>

<form>

Enter Number: <input type="text" onkeyup="showHint(this.value)">

</form>

<p>Suggestions: <span id="txtHint"></span></p>

</body>

</html>

Output:



Practical No:- 11

Practical Name: Write a program to find the factorial of the given number.

Date: 11/02/2016

Source Code:

Factno.php

<?php

$q=$_REQUEST["q"];

$hint="";

$fact=1;

if($q!=="")

{

while($q>0)

{

$fact=$fact*$q;

$q--;

}

echo "$fact";

}

else


?>

Factno.html

<html>

<head>

<script>


{

if (str.length==0)

{


return;

}



{



{

document.getElementById

("txtHint").innerHTML=xmlhttp.responseText;

}

}

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

xmlhttp.send();

}

</script>

</head>

<body>

<form>


</form>


</body>

</html>

Output:


Practical No:- 12

Practical Name: create a webpage using Ajax having a textbox for accepting a number

calculate thereverse of this number using PHP& display the output.

Date: 18/02/2016

Source Code:

Reverse.php

<?php

$q=$_REQUEST["q"];

$hint="";

$fact=1;

if($q !=="")

{

while($q>0)

{

$temp=$q%10;

echo "$temp";

if($temp==0)

break;

$q=$q/10;

}

}

else


?>

ReverseNumber.html

<html>

<head>

<script>


{

if (str.length==0)

{


return;

}




{


{

document.getElementById("txtHint").innerHTML=xmlhttp.responseText;

}

}

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

xmlhttp.send();

}

</script>

</head>

<body>

<form>


</form>


</body>

</html>

Output:


Practical No:- 13

Practical Name: Create an html file to fetch the contents ofDanceAcademy.xml using Ajax

&display them in a table.

Date: 25/02/2016

Source Code:

DANCE ACADEMY:

<?xml version="1.0" encoding="windows-1252"?>



<DANCE ACADEMY>

<DANCECOURSES>

<DANCESTYLE>hip hop</DANCESTYLE>

<DANCEFEES>1000</DANCEFEES>

</DANCECOURSES>

<DANCECOURSES>

<DANCESTYLE>break dance </DANCESTYLE>


</DANCECOURSES>

<DANCECOURSES>

<DANCESTYLE>b boying </DANCESTYLE>


</DANCECOURSES>

<DANCECOURSES>

<DANCESTYLE>tollywood </DANCESTYLE>


</DANCECOURSES>

<DANCECOURSES>

<DANCESTYLE>bollywood</DANCESTYLE>


</ DANCECOURSES>

</DANCE ACADEM >


DANCEINFO:

<!DOCTYPE html>

<html>

<head>

<script>

functionloadXMLDoc(url)

{

varxmlhttp;

vartxt,x,xx,i;

if (window.XMLHttpRequest)

{// code for IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

}

else

{// code for IE6, IE5

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}


{


{

txt="<table border='1'><tr><th>Title</th><th>Price</th></tr>";

x=xmlhttp.responseXML.documentElement.getElementsByTagName("DANCECOURSES")

;

for (i=0;i<x.length;i++)

{

txt=txt + "<tr>";

xx=x[i].getElementsByTagName("DANCESTYLE");

{

try

{

txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";

}

catch (er)

{

txt=txt + "<td></td>";

}

}

xx=x[i].getElementsByTagName("DANCEFEES");

{

try

{


txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";

}

catch (er)

{

txt=txt + "<td></td>";

}

}

txt=txt + "</tr>";

}

txt=txt + "</table>";

document.getElementById('txtCDInfo').innerHTML=txt;

}

}

xmlhttp.open("GET",url,true);

xmlhttp.send();

}

</script>

</head>

<body>

<div id="txtCDInfo">

<button onclick="loadXMLDoc('info.xml')">Display Dance list</button>

</div>

</body>

</html>

Output:

Practical No:- 14


Practical Name: Create login form username and password that validates input data in PHP

file and display appropriate message.

Date: 03/03/2016

Source Code:

usernamedemo1.html

<html>

<head>

<script>

function showHint(str)

{

if (str.length==0)

{


("txtHint").innerHTML="";

return;

}

var xmlhttp=new XMLHttpRequest();


{

if (xmlhttp.readyState==4

&&xmlhttp.status==200)

{


("txtHint").innerHTML=xmlhttp.responseText;

}


}

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

xmlhttp.send();

}

</script>

</head>

<body>

<form>

Enter Username: <input type="text"><br>

Enter Password: <input type="text"

onkeyup="showHint(this.value)">

</form>

<p><span id="txtHint"></span></p>

</body>

</html>

username1.php

<?php

$q=$_REQUEST["q"]; $hint="";

// lookup all hints from array if $q is different from ""

if ($q == "123")

{

echo "password is correct....";

}


else

echo "password is incorrect"

?>

Output:

Practical No:- 15


Practical Name: Retrieving student details from the database using ajax and php file.

Date: 10/03/2016

Source Code:

Insert. html

<html>

<body>

Marks data:

<br>

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

First Name: <input type="text" name="fname"><br>

Last Name: <input type="text" name="lname"><br>

Marks: <input type="text" name="marks"><br>

<input type="submit" name="submit">

</form>

</body>

</html>

Insert.php

<?php

$servername = "localhost";

$username = "root";

$password = "";

$dbname = "student";

$fnm = $_POST['fname'];

$lnm = $_POST['lname'];

$marks = $_POST['marks'];


// Create connection

$conn = new mysqli($servername, $username, $password, $dbname);

// Check connection

if ($conn->connect_error) {

die("Connection failed: " . $conn->connect_error);

}

$sql = "INSERT INTO marks (fname, lname, mark)

VALUES ('$fnm', '$lnm', '$marks')";

if ($conn->query($sql) === TRUE) {

echo "New record created successfully";

} else {

echo "Error: " . $sql . "<br>" . $conn->error;

}

$conn->close();

?>

Output:


Practical No:- 16

Practical Name: Using of Absolute and Relative


Date: 10/03/2016

Source Code:

Absolute.html

<html>

<head>

<title>

Absolute Positioning

</title>

</head>

<body>

<h1 align="center">

Absolute Positioning

</h1>

<div style="position:absolute; left:50; top:60;">

<img src="image1.jpg" width=205 height=120>

<br>

Image 1

</div>



<br>

Image 2

</div>



<br>

Image 3

</div>

</body>

</html>

Relative.Html

<html>

<head>


<title>

Relative Positioning

</title>

</head>

<body>

<h1 align="center">

Relative Positioning

</h1>

Do you like

<span style="position: relative; top: -5">roller</span>

<span style="position: relative; top: 5">coasters</span> as much as I

do?

</body>

</html>

Output:

Date post:	19-Jan-2017
Category:	Education
Upload:	yogita-kachve
View:	43 times
Download:	0 times

TYCS Ajax practicals sem VI

Education