Scribd
Upload
48 views

WT - Lab File

The document describes a web application for user login and registration with the following functionality: 1. The user is presented a login page to enter their name and password. 2. The server validates the credentials against a database - if valid, the user sees a welcome page. If password is invalid, a mismatch message is shown. 3. If the name is not found, the user is directed to a registration page to enter their full name, which is then stored in the database along with the login details. Sessions are used to store submitted login credentials.

Uploaded by

Chandan Sharma
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
48 views

WT - Lab File

The document describes a web application for user login and registration with the following functionality: 1. The user is presented a login page to enter their name and password. 2. The server validates the credentials against a database - if valid, the user sees a welcome page. If password is invalid, a mismatch message is shown. 3. If the name is not found, the user is directed to a registration page to enter their full name, which is then stored in the database along with the login details. Sessions are used to store submitted login credentials.

Uploaded by

Chandan Sharma
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/ 24

7.

Create an HTML page including JavaScript that takes a given set of integer numbers and
shows them after sorting in descending order.

PROGRAM:
<!DOCTYPE html>
<html>

<body>
<h2>JavaScript Array Sort</h2>
<p>Click the button to sort the array in descending order.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>

var points = [40, 100, 1, 5, 25, 10];

document.getElementById("demo").innerHTML = points;

function myFunction() {

points.sort(function(a, b){return b - a});

document.getElementById("demo").innerHTML = points;
}
</script>
</body>
OUTPUT
Experiment No 8:

Write an HTML page including any required JavaScript that takes a number from one text
field in the range of 0 to 999 and shows it in another text field in words. If the number is
out of range, it should show “out of range” and if it is not a number, it should show “not a
number” message in the result box.

<html>
<script type="text/javascript">
var nume=document.getElementById('num').value;
function isNumeric(){
var elem=document.niw.num.value;
if(elem!="") {
var numericExpression = /^[0-9]+$/;
if(elem<0||elem>999)
{ alert("Please Enter Number from 0 to 999");
document.niw.num.value="";
return false;
}
else if(elem.match(numericExpression)){
return true;
}else{ alert("Please Enter Only Number ");
document.niw.num.value="";
return false;
}}}
function numinwrd()
{
var numbr=document.getElementById('num').value;
var str=new String(numbr)

var splt=str.split("");
var rev=splt.reverse();
var once=['Zero', ' One', 'Two', 'Three', 'Four','Five', 'Six', 'Seven', 'Eight', 'Nine'];
var twos=['Ten', ' Eleven', ' Twelve', ' Thirteen', ' Fourteen', ' Fifteen', ' Sixteen', ' Seventeen', '
Eighteen',
' Nineteen'];
var tens=[ '', 'Ten', ' Twenty', ' Thirty', ' Forty', ' Fifty', ' Sixty', ' Seventy', ' Eighty', ' Ninety' ];
numlen=rev.length;
var word=new Array();
var j=0;
for(i=0;i<numlen;i++) {
switch(i) {
case 0:
if((rev[i]==0) || (rev[i+1]==1)) {word[j]='';}
else {word[j]=once[rev[i]];}
word[j]=word[j] ;
break;
case 1:
abovetens();
break;
case 2:
if(rev[i]==0) {word[j]='';}
else if((rev[i-1]==0) || (rev[i-2]==0) )
{word[j]=once[rev[i]]+"Hundred ";}
else
{word[j]=once[rev[i]]+"Hundred and";}
break;
case 3:
if(rev[i]==0 || rev[i+1]==1) {word[j]='';}
else{word[j]=once[rev[i]];}
default:break;}j++;

}
function abovetens()
{if(rev[i]==0){word[j]='';} else if(rev[i]==1){word[j]=twos[rev[i-1]];}else{word[j]=tens[rev[i]];}
}
word.reverse();
var finalw='';
for(i=0;i<numlen;i++)
{finalw= finalw+word[i];
}
document.niw.word.value=finalw;
}
</script>
<form name="niw">
<table align=center width=100% style="font-size: 12px; display: block;">
<tr><td>
<table width=100% style="font-family: Monaco, Verdana, Sans-serif; font-size: 12px;
display: block; margin-top: 14px;padding: 12px 20px 12px 20px;">
<tr> <td>Number:</td>
<td><input type="text" name="num" id="num" maxlength=9 onKeyup="isNumeric()"></td>
<td><input type="button" name="sr1" value="Click Here" onClick="numinwrd()"></td>
<td>Number in Words:</td>
<td><input type="text" name="word" id="word" size=30></td></tr>
</table>
</td></tr>
</table>
</form>
</html>
OUTPUT
EX: 9 Create a PHP file to print any text using variable.

Program

<!DOCTYPE html>

<html>

<body>

<?php

$txt1 = "Learn PHP";

$txt2 = "WT LAB 5Y";

print "<h2>" . $txt1 . "</h2>";

print "Study PHP at " . $txt2 . "<br>";

?>

</body>

</html>

OUTPUT
Exp 10 Demonstrate the use of Loops and arrays in PHP

Indexed Arrays

<!DOCTYPE html>
<html>
<body>

<?php
$cars = array("Volvo", "BMW", "Toyota");
$arrlength = count($cars);

for($x = 0; $x < $arrlength; $x++) {


echo $cars[$x];
echo "<br>";
}
?>

</body>
</html>

Volvo
BMW
Toyota

Associative arrays

<!DOCTYPE html>
<html>
<body>

<?php
$age = array("Peter"=>"35", "Ben"=>"37", "Joe"=>"43");

foreach($age as $x => $x_value) {


echo "Key=" . $x . ", Value=" . $x_value;
echo "<br>";
}
?>

</body>
</html>

Key=Peter, Value=35
Key=Ben, Value=37
Key=Joe, Value=43
Multidimensional array

<!DOCTYPE html>
<html>
<body>

<?php
$cars = array (
array("Volvo",22,18),
array("BMW",15,13),
array("Saab",5,2),
array("Land Rover",17,15)
);

echo $cars[0][0].": In stock: ".$cars[0][1].", sold: ".$cars[0][2].".<br>";


echo $cars[1][0].": In stock: ".$cars[1][1].", sold: ".$cars[1][2].".<br>";
echo $cars[2][0].": In stock: ".$cars[2][1].", sold: ".$cars[2][2].".<br>";
echo $cars[3][0].": In stock: ".$cars[3][1].", sold: ".$cars[3][2].".<br>";
?>

</body>
</html>

Volvo: In stock: 22, sold: 18.


BMW: In stock: 15, sold: 13.
Saab: In stock: 5, sold: 2.
Land Rover: In stock: 17, sold: 15.
EXP: 11 Create a PHP file using GET and POST methods.

GET Method

<?php
if( $_GET["name"] || $_GET["weight"] ) {
echo "Welcome ". $_GET['weight']. "<br />";
echo "You are ". $_GET['weight']. " kgs in weight.";

exit();
}
?>
<html>
<body>

<form action = "<?php $_PHP_SELF ?>" method = "GET">


Name: <input type = "text" name = "name" />
Weight: <input type = "text" name = "weight" />
<input type = "submit" />
</form>

</body>
</html>

POST Method

<?php
if( $_POST["name"] || $_POST["weight"] ) {
if (preg_match("/[^A-Za-z'-]/",$_POST['name'] )) {
die ("invalid name and name should be alpha");
}
echo "Welcome ". $_POST['name']. "<br />";
echo "You are ". $_POST['weight']. "kgs in weight.";

exit();
}
?>
<html>
<body>
<form action = "<?php $_PHP_SELF ?>" method = "POST">
Name: <input type = "text" name = "name" />
Weight: <input type = "text" name = "weight" />
<input type = "submit" />
</form>

</body>
</html>
EX 12: A simple calculator web application that takes two numbers and an operator (+, -, /, * and
%) from an HTML page and returns the result page with the operation performed on the
operands.

SOURCE CODE:
calc.php
<html>
<head>
<title>calculator</title>
<script language="javascript">
function validateForm()
{
first=document.f1.fvalue.value;
second=document.f1.lvalue.value;
if(first=="")
{
alert("enter value");
document.f1.fvalue.focus();
return false;
}
if(isNaN(first))
{
alert("must enter number");
document.f1.fvalue.focus();
return false;
}
if(document.f1.operator.value=="")
{
alert("choose operator");
document.f1.operator.focus();
return false;
}

if(second=="")
{
alert("enter value");
document.f1.lvalue.focus();
return false;
}
if(isNaN(second))
{
alert("must enter number");
document.f1.lvalue.focus();
return false;
}
return true;
}
</script>
</head>
<body>
<form name="f1" method="post" action="success.php" onsubmit="return validateForm();">
<table cellpadding="5" cellspacing="5" border="0">
<tr>
<td>Enter First Number</td>
<td colspan="1"><input name="fvalue" id="fvalue" type="text"/></td>
<tr>
<td>Select Operator</td>
<td><select name="operator">
<option selected value=""> choose operator</option>
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
<option value="%">%</option>

</select></td>
</tr>
<tr>
<td>Enter second Number</td>
<td><input name="lvalue" type="text" id="lvalue"/></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="calculate" value="Calculate" /></td>
</tr>
</table>
</form>
</body>
</html>
success.php
<?php
if( isset( $_REQUEST['calculate']))
{
$operator = $_REQUEST['operator'];
if($operator == "+")
{
$add1 = $_REQUEST['fvalue'];
$add2 = $_REQUEST['lvalue'];
$res = $add1 + $add2;
$result = 'SUM';
}
if($operator == "-")
{
$add1 = $_REQUEST['fvalue'];
$add2 = $_REQUEST['lvalue'];
$res = $add1 - $add2;
$result = 'DIFFERENCE';
}
if($operator == "*")
{
$add1 = $_REQUEST['fvalue'];
$add2 = $_REQUEST['lvalue'];
$res = $add1 * $add2;
$result = 'PRODUCT';
}
if($operator == "/")
{
$add1 = $_REQUEST['fvalue'];
$add2 = $_REQUEST['lvalue'];
$res= $add1 / $add2;
$result = 'DIVISION';
}
if($operator == "%")
{
$add1 = $_REQUEST['fvalue'];
$add2 = $_REQUEST['lvalue'];
$res= $add1 % $add2;
$result = 'REMAINDER';
}
}
?>
<?php echo "The <strong>".$result."</strong> Of <strong>".$add1."</strong> And
<strong>".$add2."</strong> Is <strong>". $res."</strong>"; ?>
<br/><br/><a href="calc.php">click Here</a> To Go Back To Calculator
Exp 14: A web application for implementation:
a.The user is first served a login page which takes user’s name and password. After
submitting the details the server checks these values against the data from a database
and takes the following decisions.
b. If name and password matches, serves a welcome page with user’s full name.
c.If name matches and password doesn’t match, then serves “password mismatch” page
d. If name is not found in the database, serves a registration page, where user’s full name
is asked and on submitting the full name, it stores, the login name, password and full
name in the database (hint: use session for storing the submitted login name and
password)

PROGRAM:
loginphp.php
<html>
<head>
<title>Login Now</title>
<script language="javascript">
function validate()
{
if(document.login.uname.value=="")
{
alert("enter username");
document.login.uname.focus();
return false;
}
if(document.login.pwd.value=="")
{
alert("enter password");
document.login.pwd.focus();
return false;
}
else{
return true;
}
}
</script>
</head>
<body>
<h3>Login</h3>
<form name="login" method="POST" action="" onsubmit="validate()">
<table>
<tr>
<td>username</td>
<td><input type="text" name="uname"></td>
</tr>
<tr>
<td>Password:</td>

<td><input type="password" name="pwd"></td>


</tr>
<tr>
<td></td>
<td><input type="submit" name="login" value="Login"></td>
</tr>
</table>
</form>
<?php
session_start();
mysql_connect("localhost","kgruser","acd");
mysql_select_db("kgrdb");
if(isset($_POST['login']))
{
$user=($_POST['uname']);
$pass=($_POST['pwd']);
$res=mysql_query("select userid,pwd from users where userid='$user'");
$row=mysql_fetch_row($res);
if($row[0]==$user)
{
if($row[1]==$pass)
{
$res=mysql_query("select name from users where userid='$user' and
pwd='$pass'");
$fname=mysql_result($res,0);
$_SESSION['fname']=$fname;
echo "<script> location.href='welcome.php';</script>";
}
else
{
echo "<script> location.href='pwdmismatch.php';</script>";
}
}
else
{
$_SESSION['user']=$user;
$_SESSION['pwd']=$pass;
echo "<script> location.href='reguser.php';</script>";
}
}?>

</body>
</html>
welcome.php
<?php
session_start();
echo "Welcome ".$_SESSION['fname'];
?>
passwordmismatch.php
<?php
session_start();
echo "Password is incorrect";
?>
reguser.php
<html>
<head>
<title> Registration form </title>
<body>
<form name="reg" action="" method="POST">
<h3> User Registration </h3>
Enter Full Name<input type="text" name="fname" value=""/>
<input type="submit" name="submit" value="submit"/>
</form>
<?php
session_start();
$uid=$_SESSION['user'];
$pwd=$_SESSION['pwd'];
mysql_connect("localhost","kgruser","acd");
mysql_select_db("kgrdb");
if(isset($_POST['fname'])){
$fname=$_POST['fname'];
$res=mysql_query("INSERT INTO users values('$uid','$pwd','$fname')");
if($res===TRUE)

{
echo "Registration Completed Successfully";
}
}?>
</body>
</html>
If Username & Password Matches

IF Username Password does not matches


15. Demonstrate the use of Ajax and JSON Technologies in programming examples.

i) AJAX example Accessing Information From a XML File

<!DOCTYPE html>

<html>

<style>

table,th,td {

border : 1px solid black;

border-collapse: collapse;

th,td {

padding: 5px;

</style>

<body>

<h2>The XMLHttpRequest Object</h2>

<button type="button" onclick="loadDoc()">Get my CD collection</button>

<br><br>

<table id="demo"></table>

<script>

function loadDoc() {
var xhttp = new XMLHttpRequest();

xhttp.onreadystatechange = function() {

if (this.readyState == 4 && this.status == 200) {

myFunction(this);

};

xhttp.open("GET", "cd_catalog.xml", true);

xhttp.send();

function myFunction(xml) {

var i;

var xmlDoc = xml.responseXML;

var table="<tr><th>Artist</th><th>Title</th></tr>";

var x = xmlDoc.getElementsByTagName("CD");

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

table += "<tr><td>" +

x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue +

"</td><td>" +

x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue +

"</td></tr>";

document.getElementById("demo").innerHTML = table;

</script>
</body>

</html>

XML File

CATALOG>
<CD>
<TITLE>Empire Burlesque</TITLE>
<ARTIST>Bob Dylan</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1985</YEAR>
</CD>
<CD>
<TITLE>Hide your heart</TITLE>
<ARTIST>Bonnie Tyler</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS Records</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1988</YEAR>
</CD>
<CD>
<TITLE>Greatest Hits</TITLE>
<ARTIST>Dolly Parton</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>RCA</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1982</YEAR>
</CD>
<CD>
<TITLE>Still got the blues</TITLE>
<ARTIST>Gary Moore</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Virgin records</COMPANY>
<PRICE>10.20</PRICE>
<YEAR>1990</YEAR>
</CD>
<CD>
<TITLE>Eros</TITLE>
<ARTIST>Eros Ramazzotti</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>BMG</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1997</YEAR>
</CD>
<CD>
<TITLE>ABC</TITLE>
<ARTIST>Bee Gees</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Polydor</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1998</YEAR>
</CD>
<CD>
<TITLE>Sylvias Mother</TITLE>
<ARTIST>Dr.Hook</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS</COMPANY>
<PRICE>8.10</PRICE>
<YEAR>1973</YEAR>
</CD>
<CD>
<TITLE>Maggie May</TITLE>
<ARTIST>Rod Stewart</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Pickwick</COMPANY>
<PRICE>8.50</PRICE>
<YEAR>1990</YEAR>
</CD>

</CATALOG>

OUTPUT
ii) JSON Implementation

<!DOCTYPE html>

<html>

<body>

<h2>Make a table based on JSON data.</h2>

<p id="demo"></p>

<script>

var obj, dbParam, xmlhttp, myObj, x, txt = "";

obj = { table: "customers", limit: 20 };

dbParam = JSON.stringify(obj);

xmlhttp = new XMLHttpRequest();

xmlhttp.onreadystatechange = function() {

if (this.readyState == 4 && this.status == 200) {

myObj = JSON.parse(this.responseText);

txt += "<table border='1'>"

for (x in myObj) {

txt += "<tr><td>" + myObj[x].name + "</td></tr>";

txt += "</table>"

document.getElementById("demo").innerHTML = txt;

};
xmlhttp.open("POST", "json_demo_html_table.php", true);

xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

xmlhttp.send("x=" + dbParam);

</script>

</body>

</html>

You might also like