WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 1
SEMESTER VII
WEB PROGRAMMING LABORATORY
Subject Code: 10CSL78 I.A. Marks: 25
Hours/Week : 03 Exam Hours: 03
Total Hours : 42 Exam Marks: 50
1. Develop and demonstrate a XHTML file that includes JavaScript script for the
following problems:
a) Input: A number n obtained using prompt
Output: The first n Fibonacci numbers
b) Input: A number n obtained using prompt
Output: A table of numbers from 1 to n and their squares using alert.
2. a) Develop and demonstrate, using JavaScript script, a XHTML
document that collects the USN ( the valid format is: A digit from 1 to 4
followed by two upper-case characters followed by two digits followed by
two upper-case characters followed by three digits; no embedded spaces
allowed) of the user. Event handler must be included for the form element
that collects this information to validate the input. Messages in the alert
windows must be produced when errors are detected.
b) Modify the above program to get the current semester also (restricted to be
a number from 1 to 8).
3. a) Develop and demonstrate, using JavaScript script, a XHTML
document that contains three short paragraphs of text, stacked on top of each other, with only enough of each showing so that the mouse cursor can be placed over some part of them. When the cursor is placed over the exposed part of any paragraph, it should rise to the top to become completely visible.
b) Modify the above document so that when a paragraph is moved from the top stacking position, it returns to its original position rather than to the bottom.
4. a) Design an XML document to store information about a student in an engineering college affiliated to VTU. The information must include 100 USN, Name, Name of the College, Brach, Year of Joining, and e- mail id.Make up sample data for 3 students. Create a CSS style sheet and use it to display the document.
b) Create an XSLT style sheet for one student element of the above document and use it to create a display of that element.
5. a) Write a Perl program to display various Server Information like Server
Name, Server Software, Server protocol, CGI Revision etc.
b) Write a Perl program to accept UNIX command from a HTML for and to
display the output of the command executed.
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 2
6. a) Write a Perl program to accept the User Name and display a greeting
message randomly chosen from a list of 4 greeting messages.
b) Write a Perl program to keep track of the number of visitors visiting the
web page and to display this count of visitors, with proper headings.
7. Write a Perl program to display a digital clock which displays the current time
of the server.
8. Write a Perl program to insert name and age information entered by the user
into a table created using MySQL and to display the current contents of this
table.
9. Write a PHP program to store current date-time in a COOKIE and
display the ‘Last visited on’ date-time on the web page upon reopening of the
same page.
10. Write a PHP program to store page views count in SESSION, to
increment the count on each refresh, and to show the count on web page.
11. Create a XHTML form with Name, Address Line 1, Address Line 2, and E-
mail text fields. On submitting, store the values in MySQL table. Retrieve
and display the data based on Name.
12. Build a Rails application to accept book information viz. Accession
number, title, authors, edition and publisher from a web page and store the
information in a database and to search for a book with the title specified
by the user and to display the search results with proper headings.
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 3
Lab Instructions
Steps to Execute XHTML Program.
1. Create a folder by your name in any directory
2. Open notepad and type the program and save the file with .html extension in your
folder.
3. Then open the Internet Explorer /Mozilla web browser and type
the URL as directoryname:\foldername\filename.html
Ex: E:\cse\data.html
4. Finally output will display.
Steps to Execute XML using XSLT & CSS Program
1. Create a folder by your name in any directory
2. Open notepad and type the XML program and save the file with .xml extension in your
folder.
3. Open notepad and type the XSL/CSS program and save the file with .xsl extension for
XSLT
program & save the file with .css extension for CSS program in your folder.
4. Then open the Internet Explorer /Mozilla web browser and type
the URL as directoryname:\foldername\filename.xml
Ex: E:\cse\pgmname.xml
5. Finally output will display.
Steps to run perl and Php programs #su #password: server
# cd /var/www/cgi-bin
# vi program_name.pl
All perl programs should be saved under .pl extension vi 6a.pl
save and Quit
#chmod 777 6a.pl //change the file permission before execution
To see the output go to browser and in the address bar type http://localhost/cgi-bin/6a.pl
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 4
Steps to run MYSQL programs [root@localhost ~]# service httpd start
Starting httpd:
[root@localhost ~]# service mysqld start
Starting MySQL: [ OK ]
[root@localhost ~]# mysql
Welcome to the MySQL monitor. Commands end with ; or \g.
Your MySQL connection id is 5 to server version: 3.23.58
Type 'help;' or '\h' for help. Type '\c' to clear the buffer.
mysql> create database program11;
Query OK, 1 row affected (0.00 sec)
mysql> use program11;
Database changed
mysql> create table person(name varchar(25),address1
varchar(100),address2 varchar(100),email varchar(25));
Query OK, 0 rows affected (0.00 sec)
mysql> describe person;
+----------+--------------+------+-----+---------+-------+
| Field | Type | Null | Key | Default | Extra |
+----------+--------------+------+-----+---------+-------+
| name | varchar(25) | YES | | NULL | |
| address1 | varchar(100) | YES | | NULL | |
| address2 | varchar(100) | YES | | NULL | |
| email | varchar(25) | YES | | NULL | |
+----------+--------------+------+-----+---------+-------+
4 rows in set (0.00 sec)
#chmod 777 8a.pl //change the file permission before execution
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 5
1. Develop and demonstrate a XHTML file that includes JavaScript script for the
following problems:
a) Input : A number n obtained using prompt
Output : The first n Fibonacci numbers
<html>
<head> <title> program 1a:the first n fibonacci number </title> </head>
<body>
<script type="text/javascript">
var a=0;
var b=1;
var c,i;
var n=prompt("enter n:"," ");
while(n<=0)
{
alert("enter positive value");
n=prompt("enter n:"," ");
}
document.write("fibonacci series....<br />");
document.write(a,"<br />");
document.write(b,"<br />");
for(i=0;i<n-2;i++)
{
c=a+b;
document.write(c,"<br />");
a=b;
b=c;
}
</script >
</body>
</html>
b) Input : A number n obtained using prompt
Output : A table of numbers from 1 to n and their squares using alert <html>
<body>
<script type="text/javascript">
var num = prompt("enter positive number:\n"," ");
msgstr="number and its squares are:\n";
for(i=1;i<=num;i++)
{
msgstr=msgstr+i+"-"+i*i+"\n";
}
alert(msgstr);
</script>
</body>
</html>
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 6
2. a) Develop and demonstrate, using JavaScript script, a XHTML document that
collects the USN ( the valid format is: A digit from 1 to 4 followed by two upper-
case characters followed by two digits followed by two upper-case characters
followed by three digits; no embedded spaces allowed) of the user. Event handler
must be included for the form element that collects this information to validate the
input. Messages in the alert windows must be produced when errors are detected.
<html>
<head>
<title>2a.html</title>
<head>
<script type='text/javascript'>
function formValidator()
{
var usn=document.getElementById('req1');
if(isCorrect(usn))
{
return true;
}
return false;
}
function isCorrect(elem1)
{
alphaExp1=/[1-4][A-Z][A-Z][0-9][0-9][A-Z][A-Z][0-9][0-9][0-9]$/
if(elem1.value.length==0)
{
alert("us number is empty");
elem1.focus();
return false;
}
else if(!elem1.value.match(alphaExp1))
{
alert("usn number should be in DAADDAAADDD format");
elem1.focus();
return false;
}
alert("usn number is correct");
return true;
}
</script>
</head>
<body>
<form onsubmit='return formValidator()'>
enter ur usn in daaddaaddd format:
<input type='text' id='req1'/>
<input type='submit' value='check field'/>
</form>
</body> </html>
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 7
b) Modify the above program to get the current semester also (restricted to be a
number from 1 to 8).
<html>
<head>
<script type="text/javascript">
function formValidator()
{
var usn=document.getElementById('req1');
var sem=document.getElementById('req2');
if(isCorrect(usn))
{
if(isPerfect(sem))
return true;
}
return false;
}
function isPerfect(elem2)
{
var alphaExp2=/^[1-8]$/
if(elem2.value.length==0)
{
alert("semester number is empty");
elem2.focus();
return false;
}
else if(!elem2.value.match(alphaExp2))
{
alert("invalid semester number");
elem2.focus();
return false;
}
alert("semester number is correct");
return true;
}
function isCorrect(elem1)
{
var alphaExp1=/^[1-4][A-Z][A-Z][0-9][0-9][A-Z][A-Z][0-9][0-9][0-9]$/;
if(elem1.value.length==0)
{
alert("usn num is empty");
elem1.focus();
return false;
}
else if(!elem1.value.match(alphaExp1))
{
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 8
alert("us number should be in DAADDAADDD format");
elem1.focus();
return false;
}
alert("us number is correct");
return true;
}
</script>
</head>
<body>
<form onsubmit='return formValidator()'>
Enter your usn in DADDAADDD format;
<input type='text'id='req1'/><br/>
Enter ur sem is IN [1-8]format
<input type='text'id='req2'/><br/>
<input type='submit' value='checkfield'/>
</form>
</body>
3. a) Develop and demonstrate, using JavaScript script, a XHTML document that
contains three short paragraphs of text, stacked on top of each other, with only enough
of each showing so that the mouse cursor can be placed over some part of them. When
the cursor is placed over the exposed part of any paragraph, it should rise to the top to
become completely visible.
<html>
<head>
<title>the stacking order</title>
<style type="text/css">
.layer1style
{
border: solid thick black;
padding: 1cm;
width: 300px;
background-color:yellow;
position: absolute;
top:100px;
left:200px;
z-index:0;
}
.layer2style
{
border:solid thick red;
padding:1cm;
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 9
width:300px;
background-color:BLUE;
position:absolute;
top:120px;
left:220px;
z-index:0;
}
.layer3style
{
border:solid thick green;
padding:1em;
width:300px;
background-color:purple;
position:absolute;
top:140px;
left:240px;
z-index:0;
}
</style>
<script type="text/javascript">
var topLayer="layer3";
function mover(toTop)
{
var oldTop=document.getElementById(topLayer).style;
var newTop=document.getElementById(toTop).style;
oldTop.zIndex="0";
newTop.zIndex="10";
topLayer=document.getElementById(toTop).id;
}
</script>
</head>
<body>
<h2>stacking on paragraphs</h2>
<div style="z-index: 10;" class="layer1style" id="layer1" onmouseover="mover('layer1')">
the lives of most inhabitants of industrialozed countries
,as well as some unindustrialized countries have been
changed forever by the advent of www
</div>
<div style="z-index: 2;" class="layer2style" id="layer2" onmouseover="mover('layer2')">
the www may seem like magic,untill u understand
how it works.The web is accesed through browser
</div>
<div style="z-index:0;" class="layer3style" id="layer3" onmouseover="mover('layer3')">
windows xp provides many ways for you to communicate with friends,
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 10
co workers and with rest of the world
</div>
</body>
</html>
b) Modify the above document so that when a paragraph is moved from the top
stacking position, it returns to its original position rather than to the bottom.
<html>
<head>
<title>the stacking order</title>
<style type="text/css">
.layer1style
{
border:solid thick black;
padding:1em;
width:300px;
background-color:yellow;
position: absolute;
top:200px;
left:400px;
z-index:1;
}
.layer2style
{
border:solid thick blue;
padding:1em;
width:300px;
background-color:red;
position:absolute;
top:220px;
left:420px;
z-index:2;
}
.layer3style
{
border:solid thick brown;
padding:1em;
width:300px;
background-color:orange;
position:absolute;
top:240px;
left:440px;
z-index:3;
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 11
}
</style>
<script type="text/javascript">
var toplayer="layer3";
var origpos;
function mover(totop,pos)
{
var newtop=document.getElementById(totop).style;
newtop.zIndex="10";
toplayer=document.getElementById(totop).id;
origpos=pos;
}
function moveBack()
{
document.getElementById(toplayer).style.zIndex=origpos;
}
</script>
</head>
<body>
<br />
<br />
<h3>
stacking on paragraphs and moved from top stacking position it returns
to its original position
</h3>
<div style="z-index:1;" class="layer1style" id="layer1"
onmouseover="mover('layer1','1')"
onmouseout="moveBack()">
the lives of most inhabitants of industrialozed countries
,as well as some unindustrialized countries have been
changed forever by the advent of www
</div>
<div style="z-index:2;" class="layer2style" id="layer2"
onmouseover="mover('layer2','2')"
onmouseout="moveBack()">
the www may seem like magic,untill u understand
how it works.The web is accesed through browser
</div>
<div style="z-index:3;" class="layer3style" id="layer3"
onmouseover="mover('layer3','3')"
onmouseout="moveBack()">
windows xp provides many ways for you to communicate with friends,
co workers and with rest of the world
</div>
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 12
<script type="text/javascript">
</script>
</body>
</html>
4. a) Design an XML document to store information about a student in an engineering
college affiliated to VTU. The information must include USN, Name, Name of the
College, Brach, Year of Joining, and e-mail id.Make up sample data for 3 students.
Create a CSS style sheet and use it to display the document.
4a.xml
<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="4a.css"?>
<students>
<vtu>
<usn> 4jd10cs044 </usn>
<name> amar</name>
<college>bit</college>
<branch>CS</branch>
<YOJ>2008</YOJ>
<email>[email protected]</email>
</vtu>
<vtu>
<usn> 4jd10cs046 </usn>
<name> leela</name>
<college>bit</college>
<branch>CS</branch>
<YOJ>2008</YOJ>
<email>[email protected]</email>
</vtu>
<vtu>
<usn> 4jd10cs048 </usn>
<name> manu</name>
<college>bit</college>
<branch>CS</branch>
<YOJ>2008</YOJ>
<email>[email protected]</email>
</vtu>
</students>
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 13
4a.css
vtu{display:block;
margin-top:15px;
color:blue;
}
name{display:block;
color:green;
font-size:16pt
}
college{display:block;
color:green;
font-size:12pt
}
branch{display:block;
color:green;
font-size:12pt
}
YOJ{display:block;
color:green;
font-size:12pt
}
email{display:block;
color:green;
font-size:12pt
}
usn{display:block;
color:maroon;
font-size:16pt
}
b) Create an XSLT style sheet for one student element of the above document and
use it to create a display of that element.
4b.xml
<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="4b.xsl"?>
<Student> <Student_Info> <USN>4JD10CS053</USN>
<NAME>SukruthGowda</NAME> <COLLEGE>JIT</COLLEGE> <BRANCH>CSE</BRANCH>
<YOJ>2008</YOJ> <Email>[email protected] </Email> </Student_Info>
</Student>
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 14
4b.xsl
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/"> <html> <body>
<h2> STUDENT DATABASE</h2> <table border="1"> <tr bgcolor="pink">
<th>USN</th>
<th>NAME</th> <th>NAME OF COLLEGE</th> <th>BRANCH</th>
<th>YEAR OF JOINING</th> <th>Email</th> </tr>
<xsl:for-each select="Student/Student_Info"> <tr bgcolor="pink"> <td><xsl:value-of select="USN"/></td>
<td><xsl:value-of select="NAME"/></td>
<td><xsl:value-of select="COLLEGE"/></td> <td><xsl:value-of select="BRANCH"/></td> <td><xsl:value-of select="YOJ"/></td>
<td><xsl:value-of select="Email"/></td> </tr> </xsl:for-each>
</table> </body> </html>
</xsl:template>
</xsl:stylesheet>
5. a) Write a Perl program to display various Server Information like Server Name,
Server Software, Server protocol, CGI Revision etc.
#!/usr/bin/perl
#This line tells the machine to run the file through perl
#Environment variables can be accssed using $ENV.
print"content-type:text/html","\n\n";
print"<html><body bgcolor='yellow'><h1><center>SERVER
INFORMATION<center></h1><br>";
print"<hr><br>Server name=",$ENV{'SERVER_NAME'};
print"<br>Running Port=",$ENV{'SERVER_PORT'};
print"<br>SERVER PROTOCOL=",$ENV{'SERVER_PROTOCOL'};
print"<br>SERVER SOFTWARE=",$ENV{'SERVER_SOFTWARE'};
print"<br>CGI version=",$ENV{'GATEWAY_INTERFACE'};
print"<br><hr></body></html>";
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 15
b) Write a Perl program to accept UNIX command from a HTML for and to display
the output of the command executed.
5b.html
<html>
<head><title>UNIX COMMANDS</title></head>
<body bgcolor="green">
<form action="http://localhost/cgi-bin/5b.pl" method="get">
<input type="text" name="command">
<input type="submit" value="execute">
<input type="reset" value="clear">
</form>
</body>
</html>
5b.pl
#!/usr/bin/perl
use CGI":standard";
print"content-type:text/html","\n\n";
$input=param(command);
print"";
print"<html><body><h1>command result</h1><br>command executed:",$input;
#system($input);
print`$input`;
print"</body></html>";
6. a) Write a Perl program to accept the User Name and display a greeting message
randomly chosen from a list of 4 greeting messages.
6a.html
<html>
<head>
<title> Greeting </html>
</head>
<body bgcolor="pink">
<h3> Enter Name and Recieve Greetings</h3>
<form action="http://localhost/cgi-bin/6a.pl" method="get">
Name:<input type="text name="name"><br><br>
<input type="submit" value="click">
<input type="reset" value="reset">
</form>
</body>
</html>
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 16
6a.pl
#!/usr/bin/perl
use CGI':standard';
print "content-type:text/html\n\n";
$input=param("username");
my @msgs=("Good morning","Welcome","How are you doing?","Hello!");
$i=int rand scalar @msgs;
print "Hi, $input.<br>Message: " , $msgs [$i];
b) Write a Perl program to keep track of the number of visitors visiting the web page
and to display this count of visitors, with proper headings.
#!"C:\xampp\perl\bin\perl.exe"
use CGI ':standard';
use CGI::Carp qw(warningsToBrowser);
print header();
print start_html(-title=>"WebPage Counter",-bgcolor=>"Pink",-text=>"blue");
open(FILE,'<count.txt');
$count=<FILE>;
close(FILE);
$count++;
open(FILE,'>count.txt');
print FILE "$count";
print ("This page has been viewed $count times");
close(FILE);
print end_html();
Note: Program should be executed in Xampp server. C Xampp cgi-bin take text file
and saveas 6.pl it should be PL file.
Output: in browser type: localhost/cgi-bin/6b.pl
7. Write a Perl program to display a digital clock which displays the current time of the
server.
#!/usr/bin/perl
use CGI':standard';
$de=1;
$mm="AM";
print "Refresh:",$de,"\n";
print "content-type:text/html","\n\n";
print "<html><body bgcolor=cyan><center><h1>DIGITAL
CLOCK</CENTER></h1><br>";
($s,$m,$h)=localtime(time);
if($h>=12)
{
$h=$h-12;
$mm="PM";
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 17
}
print"<table align=center border=2 bgcolor=white><tr><td><font color=magenta
size=8>$h</td><td><font size=10>:</td><td><font color=red
size=8>$m</td><td><font
size=8>:</td><td><font size=7>$s</td><td><font color=magenta
size=8>$mm</font></td></tr></table>";
print"<br><br><center><h2>the current system time is $h hours $m minutes $s
seconds</center></h2>";
print"<br></body></html>";
8. Write a Perl program to insert name and age information entered by the user into a
table created using MySQL and to display the current contents of this table.
8.html
<html>
<body>
<form action="http://localhost/cgi-bin/8.pl">
Name:<input type="text" name="name"<br>
Age:<input type="text" name="age"><br>
<input type="submit" value="submit">
</form>
</body>
</html>
8.pl
#!/usr/bin/perl
print "Content-type: text/html\n\n";
print "<HTML><TITLE>Result of the insert operation</TITLE>";
use CGI ':standard';
use DBI;
$dbh=DBI->connect("DBI:mysql:program8","root","");
$name=param("name");
$age=param("age");
$qh=$dbh->prepare("insert into student values('$name','$age')");
$qh->execute();
$qh=$dbh->prepare("Select *from student");
$qh->execute();
print "<table border size=1><tr><th>Name</th><th>Age</th></tr>";
while( ($name,$age)=$qh->fetchrow())
{
print "<tr><td>$name</td><td>$age</td></tr>";
}
print "</table>";
$qh->finish();
$dbh->disconnect();
print"</HTML>";
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 18
9. Write a PHP program to store current date-time in a COOKIE and display the
„Last visited on‟ date-time on the web page upon reopening of the same page.
<?php
$month=259200+time();
setcookie(AboutVisit,date("F jS - g:i a"),$month);
?>
<html>
<body>
<?php
if(isset($_COOKIE['AboutVisit']))
{
$last=$_COOKIE['AboutVisit'];
echo"welcome back!!<br>u last visit on".$last;
}
else
{
echo "welcome to our site!";
}
?>
</body>
</html>
10. Write a PHP program to store page views count in SESSION, to increment
the count on each refresh, and to show the count on web page.
<?php
session_start();
session_register("count");
if(!isset($_SESSION))
{
$_SESSION["count"]=0;
echo "<p>Counter initialized</p>/n";
}
else
{
$_SESSION["count"]++;
}
echo"<p>the counter is now <b>$_SESSION[count]</b></p>".
"<p>reload this page to increment</p>";
?>
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 19
11. Create a XHTML form with Name, Address Line 1, Address Line 2, and E-mail text
fields. On submitting, store the values in MySQL table. Retrieve and display the data
based on Name.
11a.html
<html>
<head><title>pg11</title></head>
<form action="http://localhost/cgi-bin/11a.php" method="post">
<p>
name:<input type=text name="name" value=""><br>
address1:<input type=text name="add1" value=""><br>
address2:<input type=text name="add2" value=""><br>
email:<input type=text name="email" value=""><br>
<input type=submit>
</p>
</form>
<hr>
<form action="http://localhost/cgi-bin/11b.php" method="post">
Enter Name of the contact to be searched <input type="text" name="name">
<input type=submit>
</form>
</body>
</html>
11a.php
<?php
$dbh=mysql_connect('localhost','root','')or
die(mysql_error());
mysql_select_db('cust_info')or die(mysql_error());
if(isset($_POST['name']))
$name=$_POST['name'];
$add1=$_POST['add1'];
$add2=$_POST['add2'];
$email=$_POST['email'];
if($name!=""&&$add1!="")
{
$query="INSERT INTO address VALUES('$name','$add1','$add2','$email')";
$result=mysql_query($query) or die(mysql_error());
}
else
{
echo "one of the field is empty";
}
mysql_close($dbh);
echo "Data Inserted <br><hr>";
?>
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 20
11b.php
<?php
$link=mysql_connect("localhost","root","");
mysql_select_db("cust_info");
$n=$_POST["name"];
print "Entered Name is $n \n";
$var=mysql_query("SELECT * FROM address WHERE name like '%$n%'");
echo"<table border size=1>";
echo"<tr> <th>Name</th> <th>Addr1</th>
<th>Addr2</th><th>Email</th></tr>";
while ($arr=mysql_fetch_row($var))
{echo "<tr><td>$arr[0]</td><td>$arr[1]</td><td>$arr[2]</td>
<td>$arr[3]</td></tr>";}
echo"</table>";
mysql_free_result($var);
mysql_close($link);
?>
12. Build a Rails application to accept book information viz. Accession number,
title, authors, edition and publisher from a web page and store the information in a
database and to search for a book with the title specified by the user and to display the
search results with proper headings.
Creating Books Database
mysql -u root
create database program12_development;
use program12_development;
create table books (
id int not null auto_increment,
accession_no int not null,
title varchar(80) not null,
authors text not null,
edition decimal(8, 2) not null,
publisher varchar(80) not null,
primary key(id)
);
After creating the database and table, quit from mysql.. quit;
Creating lab12 Project
rails -d mysql program12
Change the directory to program12
cd program12
Creating controller, model and view from database
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 21
ruby script/generate scaffold Book accession_no:integer title:string authors:text edition:float
publisher:string
Starting Rails Server
ruby script/server
Executing in the web browser
http://localhost:3000/books
Creating main (new) controller for searching book
ruby script/generate controller main
Opening main controller program
Notepad app\controllers\main_controller.rb
class MainController < ApplicationController
def welcome
@num_books = Book.count
end
def result
@bookid = params[:title]
@bookz = Book.find(:all, :conditions => "title = '#{@bookid}' ")
end
end
Create two views welcome and result
Create Result view file
> notepad app\views\main\result.rhtml
<html>
<title> Welcome template for books </title>
<body>
<p> Entered book title is <%= @title%> </p>
<table border=1>
<tr><th>Accession No.</th><th>Book Title</th><th>Authors </th> <th>Publishers </th>
<th>Edition </th></tr>
<% @bookz.each do |bk|
@id = bk.id
@accession= bk.accession_no;
@title = bk.title
@authors = bk.authors
@publisher = bk.publisher
@edition = bk.edition %>
<tr>
<td> <%= @accession %></td>
<td><%= @title %> </td>
<td><%= @authors %></td>
<td> <%= @publisher %></td>
<td> <%= @edition %></td>
</tr>
<% end %>
</table>
</form>
WEB Programming laboratory (10CSL78)
Dept. of CS&E, Jain Institute of Technology, Davanagere 22
</body>
</html>
Create Welcome view file
> notepad app\views\main\welcome.rhtml
<html>
<title> Welcome template for books </title>
<body>
<p> Total number of books = <%= @num_books %> </p>
<form action = "result" >
Enter Searching Title: <input type="text" name="title" />
<input type=submit value="Search" />
</form>
</body>
</html>
Starting Rails Server
ruby script/server
Executing in the web browser
http://localhost:3000/main/welcome
save as “Welcome.rhtml”
“Result.rhtml”