Scribd
Upload
210 views

Web Lab Record

The document provides code for several web programming programs and their outputs. Program 5a develops an XHTML document with JavaScript that contains three stacked paragraphs of text. When the mouse cursor is placed over an exposed part of a paragraph, that paragraph rises to the top to become fully visible while the other paragraphs move below with lowered z-index values.

Uploaded by

Sandeep V Gowda
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
210 views

Web Lab Record

The document provides code for several web programming programs and their outputs. Program 5a develops an XHTML document with JavaScript that contains three stacked paragraphs of text. When the mouse cursor is placed over an exposed part of a paragraph, that paragraph rises to the top to become fully visible while the other paragraphs move below with lowered z-index values.

Uploaded by

Sandeep V Gowda
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 49

Web Programming

Program 1: Develop and demonstrate a XHTML document that illustrates the use
external style sheet, ordered list, table, borders, padding, colour, and the tag.

prog1.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 1</title> <link rel="stylesheet" href="lab1.css" type="text/css"/> </head> <body> <p> Name: Sandeep<br/> Phone: 8971474414<br/> Email: [email protected] </p> <p class="title"> Favourite Website:<a href="www.google.com">Google</a></p> <h3> Educational Qualification</h3> <table border="3" cellpadding="20" cellspacing="30"> <tr> <th>Course</th> <th>Board</th> <th>Percentage</th> </tr> <tr class="mine"> <td>X</td> <td>SSLC</td> <td>56.83%</td> </tr> <tr class="mine"> <td>XII</td> <td>PUC</td> <td>68.83%</td> </tr> <tr class="mine"> <td>B.E</td> <td>VTU</td> <td>72.67%</td> </tr> </table> <h3> Technical Skills</h3> <ol class="mine"> <li>C</li> <li>C++</li> <li>Java</li> </ol> <h3> About Me</h3>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 1

Web Programming
<p class="one"> I am a self motivated person who believes in team work.<span class="spanstyle"> An enthusiastic person. Accomplishes any task assigned with top priority. Always willing to learn something new.</span> </p> </body> </html>

lab1.css
@CHARSET "ISO-8859-1"; body { background-color:pink; } .title { font-size:14; font-family:bookman old style; color:black; } .mine { font-size:14; font-family:monotype corsivo; color:blue; } .spanstyle { font-size:36; font-family:antiqua; color:red; } .one { margin:1in; padding:0.5in; background-color:green; border:dashed; }

T John Institute of Technology, Dept. of ISE, 2011-12

Page 2

Web Programming
OUTPUT:
Name: Sandeep Phone: 8971474414 Email: [email protected]
Favourite Website: LinkedIn

Educational Qualification

Course

Board

Percentage

SSLC

89.92%

XII

PUC

68.83%

B.E

VTU

60.48%

Technical Skills
1. 2. 3. 4. C C++ Java C#

About Me

An enthusiastic person. Accomplishes any task assigned with top priority. Always willing to learn something new.
I am a self motivated person who believes in team work.

T John Institute of Technology, Dept. of ISE, 2011-12

Page 3

Web Programming
Program 2a: Develop and demonstrate a XHTML file that includes Javascript
script for the following problems: Input: A number n obtained using prompt. Output: The first n Fibonacci Numbers.

prog2a.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 2a</title> </head> <body> <script type="text/javascript"> var number=prompt("Enter a number",""); var f1=0; var f2=1; document.write("Fibonacci Series"+f1+" "+f2); var i,f3; for(i=2;i<number;i++) { f3=f1+f2; document.write(" "+f3); f1=f2; f2=f3; } </script> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 4

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 5

Web Programming
Program 2b: Input: A number n obtained using prompt.
Output: A table of numbers from 1 to n and their squares using alert. prog2b.html
<! DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 2b</title> </head> <body> <script type="text/javascript"> var no=prompt("Enter a limit"," "); var result="Squares"+"\n"; for(j=1;j<=no;j++) { result=result+"square of "+j+" is"+(j*j)+"\n"; } alert(" "+result); </script> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 6

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 7

Web Programming
Program 3a: Develop and demonstrate a XHTML file that includes Javascript
script that uses function for the following problems: Parameter: A string. Output: The position in the string of the left most vowel.

prog3a.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 3a</title> <script type="text/javascript"> function myfun(str) { var len=str.length; var pos=len+1; var i=0; for(i=0;i<pos;i++) { if(str.charAt(i)=="a" || str.charAt(i)=="e" || str.charAt(i)=="i" || str.charAt(i)=="o" || str.charAt(i)=="u") { document.write("the first vowel in string is at position:"+(++i)); return; } } } </script> </head> <body> <label>Enter string:</label> <input type="text" name="mytext"/> <input type="button" value="Click me" onClick="myfun(mytext.value)"/> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 8

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 9

Web Programming
Program 3b: Parameter: A number.
Output: The number with its digits in the reverse order.

prog3b.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 3b</title> <script type="text/javascript"> function my(num) { var num1=" "; document.write("Entered no:"+num+"\n"); document.write("<br/>"); var num2=num; var l=num2.length; var i=l-1; for(i=l-1;i>=0;i--) { num1=num1+(num.charAt(i)); } document.write("Reversed no:"+num1); } </script> </head> <body> <label>Enter number:</label> <input type="text" name="mytext"/> <input type="button" value="Click me" onClick="my(mytext.value)"/> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 10

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 11

Web Programming
Program 4a: 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.

prog4a.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 4a</title> <script type="text/javascript"> function vali(myt) { var ok=myt.search(/[1-4][A-Z]{2}\d{2}[A-Z]{2}\d{3}/); if(ok==0 && myt.length==10) alert("Valid Usn"+myt); else alert("Invalid Usn"+myt); } </script> </head> <body> <label>Enter Usn:</label> <input type="text" name="mytext"/> <input type="button" value="Click me" onClick="vali(mytext.value)"/> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 12

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 13

Web Programming
Program 4b: Modify the above program to get the current semester also
(restricted to be a number from 1 to 8).

prog4b.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 4b</title> <script type="text/javascript"> function val(my) { var t=my.search(/[1-8]/); if(t==0 && my.length==1) alert("Valid Sem"+my); else alert("Invalid Sem"+my); } </script> </head> <body> <label>Enter Sem:</label> <input type="text" name="mytext"/> <input type="button" value="Click me" onClick="val(mytext.value)"/> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 14

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 15

Web Programming
Program 5a: 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.

prog5a.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 5a</title> <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> <div id="layer1" style="background:#f000f0; z-index:10; position:absolute; left:10px; top:100px; width:400px;" onmouseover="mover('layer1')"> Cloud computing describes both a platform and a type of application. A cloud computingplatform dynamically provisions, configures, reconfigures, and deprovisions servers as needed. Cloud applications are applications that are extended to be accessible through the Internet and they use large data centers and powerful servers that host Web applications and Web services. Cloud computing infrastructure accelerates and fosters the adoption of innovations. Cloud computing infrastructure allows enterprises to achieve more efficient use of their IT hardware and software investments. </div> <div id="layer2" style="background:#00f0f0; z-index:2; position:absolute; left:60px; top:150px; width:400px;" onmouseover="mover('layer2')"> Cloud computing describes both a platform and a type of application. A cloud computingplatform dynamically provisions, configures, reconfigures, and deprovisions servers as needed. Cloud applications are applications that are extended to be accessible through the Internet and they use large data centers and powerful servers that host Web applications and Web services. Cloud computing infrastructure accelerates and fosters the adoption of innovations. Cloud computing infrastructure allows enterprises to achieve more efficient use of their IT hardware and software investments. </div>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 16

Web Programming
<div id="layer3" style="background:#f0f000; z-index:0; position:absolute; left:110px; top:200px; width:400px;" onmouseover="mover('layer3')"> Cloud computing describes both a platform and a type of application. A cloud computingplatform dynamically provisions, configures, reconfigures, and deprovisions servers as needed. Cloud applications are applications that are extended to be accessible through the Internet and they use large data centers and powerful servers that host Web applications and Web services. Cloud computing infrastructure accelerates and fosters the adoption of innovations. Cloud computing infrastructure allows enterprises to achieve more efficient use of their IT hardware and software investments. </div> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 17

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 18

Web Programming
Program 5b: 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.

prog5b.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 5b</title> <script type="text/javascript"> function bringToTop(id,index,n) { var div=document.getElementById(id+index); var i,maximum; maximum=-1; for(i=0;i<n;i++) { if(i!=index && document.getElementById(id+i).style.zIndex>maximum) maximum=document.getElementById(id+i).style.zIndex; } div.style.zIndex=maximum+1; } function resetPosition(id,index) { var div=document.getElementById(id+index); div.style.zIndex=index; } </script> </head> <body> <div id="b0" style="background:#f000f0; z-index:0; position:absolute; left:10px; top:500px; width:400px;" onmouseover="bringToTop('b',0,3)" onmouseout="resetPosition('b',0);"> Cloud computing describes both a platform and a type of application. A cloud computingplatform dynamically provisions, configures, reconfigures, and deprovisions servers as needed. Cloud applications are applications that are extended to be accessible through the Internet and they use large data centers and powerful servers that host Web applications and Web services. Cloud computing infrastructure accelerates and fosters the adoption of innovations. Cloud computing infrastructure allows enterprises to achieve more efficient use of their IT hardware and software investments. </div> <div id="b1" style="background:#00f0f0; z-index:1; position:absolute; left:60px; top:550px; width:400px;" onmouseover="bringToTop('b',1,3)" onmouseout="resetPosition('b',1);"> Cloud computing describes both a platform and a type of application.

T John Institute of Technology, Dept. of ISE, 2011-12

Page 19

Web Programming
A cloud computingplatform dynamically provisions, configures, reconfigures, and deprovisions servers as needed. Cloud applications are applications that are extended to be accessible through the Internet and they use large data centers and powerful servers that host Web applications and Web services. Cloud computing infrastructure accelerates and fosters the adoption of innovations. Cloud computing infrastructure allows enterprises to achieve more efficient use of their IT hardware and software investments. </div> <div id="b2" style="background:#f0f000; z-index:2; position:absolute; left:110px; top:600px; width:400px;" onmouseover="bringToTop('b',2,3)" onmouseout="resetPosition('b',2);"> Cloud computing describes both a platform and a type of application. A cloud computingplatform dynamically provisions, configures, reconfigures, and deprovisions servers as needed. Cloud applications are applications that are extended to be accessible through the Internet and they use large data centers and powerful servers that host Web applications and Web services. Cloud computing infrastructure accelerates and fosters the adoption of innovations. Cloud computing infrastructure allows enterprises to achieve more efficient use of their IT hardware and software investments. </div> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 20

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 21

Web Programming
Program 6a: 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.

prog6a.xml
<?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet type="text/css" href="lab6.css"?> <student> <h3> Student Info</h3> <h2>Student1</h2> <VTU> <label>Usn:<usn>1TJ08IS002</usn></label> <label>Name:<name>Akhilaa</name></label> <label>College:<college>TJIT</college></label> <label>Branch:<branch>ISE</branch></label> <label>YOJ:<yoj>2008</yoj></label> <label>Email:<email>[email protected]</email></label> </VTU> <h2>Student1</h2> <VTU> <label>Usn:<usn>1BI07CV053</usn></label> <label>Name:<name>Vinay N</name></label> <label>College:<college>BIT</college></label> <label>Branch:<branch>CV</branch></label> <label>YOJ:<yoj>2007</yoj></label> <label>Email:<email>[email protected]</email></label> </VTU> <h2>Student1</h2> <VTU> <label>Usn:<usn>1PE08IS002</usn></label> <label>Name:<name>Arnitha</name></label> <label>College:<college>PESIT</college></label> <label>Branch:<branch>ECE</branch></label> <label>YOJ:<yoj>2009</yoj></label> <label>Email:<email>[email protected]</email></label> </VTU> </student>

lab6.css @CHARSET "ISO-8859-1"; VTU {display:block; color:blue; margin-top:15px;} usn {display:block; color:green; font-size:12pt; margin-top:15px;} name {display:block; color:red; font-size:12pt; margin-top:15px;} college{display:block; color:red; font-size:12pt; margin-top:15px;}

T John Institute of Technology, Dept. of ISE, 2011-12

Page 22

Web Programming
branch {display:block; color:red; font-size:12pt; margin-top:15px;} yoj {display:block; color:red; font-size:12pt; margin-top:15px;} email {display:block; color:red; font-size:12pt; margin-top:15px;} h3 {display:block; color:red; font-size:18pt;} h2 {display:block; color:red; font-size:18pt;}

T John Institute of Technology, Dept. of ISE, 2011-12

Page 23

Web Programming
OUTPUT: Student Info Student1
Usn: 1TJ08IS002 Name: Sandeep College: TJIT Branch: ISE YOJ: 2008 Email: [email protected]

Student1
Usn:1BI07CV053 Name:Vinay N College:BIT Branch:CV YOJ:2007 Email:[email protected]

Student1
Usn:1PE08IS002 Name: Shaistha College: PESIT Branch: ECE YOJ: 2009 Email:[email protected]

T John Institute of Technology, Dept. of ISE, 2011-12

Page 24

Web Programming
Program 6b: Create an XSLT style sheet for one student element of the above
document and use it to create a display of that element. prog6b.xml
<?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet type="text/xsl" href="lab6b.xsl"?> <student> <usn>1TJ08IS002</usn> <name>Akhilaa</name> <college>TJIT</college> <branch>ISE</branch> <yoj>2008</yoj> <email>[email protected]</email> </student>

lab6b.xsl
<?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/TR/xhtml1/strict"> <xsl:template match="/"> <span style="font-style:italic;color:green;">usn</span> <xsl:value-of select="student/usn"/><br /> <span style="font-style:italic;color:green;">name</span> <xsl:value-of select="student/name"/><br /> <span style="font-style:italic;color:green;">college</span> <xsl:value-of select="student/college"/><br /> <span style="font-style:italic;color:green;">branch</span> <xsl:value-of select="student/branch"/><br /> <span style="font-style:italic;color:green;">yoj</span> <xsl:value-of select="student/yoj"/><br /> <span style="font-style:italic;color:green;">email</span> <xsl:value-of select="student/email"/><br /> </xsl:template> </xsl:stylesheet>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 25

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 26

Web Programming
Program 7a: Write a Perl program to display various Server Information like
Server Name, Server Software, Server protocol, CGI Revision etc. prog7a.pl
#!usr/bin/perl print"content-type:text/html \n\n"; print"<html>"; print"<head> <title>Program 7a</title></head>"; print"<body bgcolor=yellow>"; print"<h2>server info</h2>"; print"<table border=3>"; print"<tr>"; print"<td>server name </td>"; print "<td>".$ENV{SERVER_NAME}."</td>"; print"</tr>"; print"<tr>"; print"<th>server port</th>"; print"<td>".$ENV{"SERVER_PORT"}."</td>"; print"</tr>"; print"<tr>"; print"<th>server software</th>"; print"<td>".$ENV{"SERVER_SOFTWARE"}."</td>"; print"</tr>"; print"<tr>"; print"<th>gateway_interface</th>"; print"<td>".$ENV{"GATEWAY_INTERFACE"}."</td>"; print"</tr>"; print"<tr>"; print"<th>server protocol</th>"; print"<td>".$ENV{"SERVER_PROTOCOL"}."</td>"; print"</tr>"; print"<tr>"; print"<th>host name</th>"; print"<td>",'/bin/hostname',"</td>"; print"</tr>"; print"</table></body></html>"; print"</table>"; print"</body>"; print"</html>";

T John Institute of Technology, Dept. of ISE, 2011-12

Page 27

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 28

Web Programming
Program 7b: Write a Perl program to accept UNIX command from a HTML form
and to display the output of the command executed. lab7b.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 7b</title> </head> <body> <form action="http://localhost/akhilaa3/prog7b.pl"> <p> <input type="text" name="akhi"/> <input type="submit" value="Click"/> <input type="reset" value="Cancel"/> </p> </form> </body> </html>

prog7b.pl
#!usr/bin/perl print "content-type:text/html\n\n"; print "<html>"; print "<head><title>pro</title></head>"; print "<body bgcolor=yellow>"; ($name,$com)=split(/=/,$ENV{"QUERY_STRING"}); print `$com`; print "</body>"; print "</html>";

T John Institute of Technology, Dept. of ISE, 2011-12

Page 29

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 30

Web Programming
Program 8a: Write a Perl program to accept the User Name and display a
greeting message randomly chosen from a list of 4 greeting messages. lab8a.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 8a</title> </head> <body> <form action="http://localhost/akhilaa3/prog8a.pl"> <label>Enter a string</label> <input type="text" name="Execute"/> <input type="submit" value="Submit"/> <input type="reset" value="Reset"/> </p> </body> </html>

prog8a.pl
#!usr/bin/perl print "content-type:text/html\n\n"; print "<html>"; print "<head><title>Program 8a</title></head>"; print " <body bgcolor=green>"; @mymsg=("hello","hi","good morning","good night","welcome"); $myrand=int(rand(5)); ($id,$name)=split(/=/,$ENV{"QUERY_STRING"}); print $mymsg[$myrand]." ".$name; print "</body></html>";

T John Institute of Technology, Dept. of ISE, 2011-12

Page 31

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 32

Web Programming

T John Institute of Technology, Dept. of ISE, 2011-12

Page 33

Web Programming

T John Institute of Technology, Dept. of ISE, 2011-12

Page 34

Web Programming
Program 8b: 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. prog8b.pl
#!/usr/bin/perl print "content-type:text/html\n\n"; print "<html>"; print "<head><title>Program 8a</title></head>"; print "<body bgcolor=green>"; open (MYFILE,'<count.txt'); $count=<MYFILE>; close(MYFILE); $count++; open(MYFILE,'>count.txt'); print MYFILE "$count"; close (MYFILE); print "<p> your visitor no ".$count."</p>"; print "</body></html>";

T John Institute of Technology, Dept. of ISE, 2011-12

Page 35

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 36

Web Programming
Program 9: Write a Perl program to display a digital clock which displays the
current time of the server. prog9.pl
#!/usr/bin/perl print "content-type:text/html\n\n"; print "<html>"; print "<head><title>program 9A</title>"; print "<meta http-equiv=refresh content=1>"; print "</head>"; print "<body bgcolor=green>"; ($s,$m,$h)=localtime(time); print "TIME=".$h.":".$m.":".$s."<br />"; print "</body></html>";

OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 37

Web Programming
Program 10: 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.

prog10.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 10</title> </head> <body> <form action="http://localhost/prog10.pl" method="post"> Usn:<input type="text" name="usn"/><br/> Name:<input type="text" name="name"/><br/> Age:<input type="text" name="age"/><br/> <input type="submit" value="click"/> </form> </body> </html>

prog10.pl
#!usr/bin/perl use CGI':standard'; use DBI; print"content-type:text/html \n\n"; print"<html>"; print"<head><title>Program 10</title></html><body>"; @pairs=split(/&/,$ENV{"QUERY_STRING"}); $usn=param("usn"); $name=param("name"); $age=param("age"); $databaseName="DBI:mysql:class"; $dbh=DBI->connect($databaseName,"root","")||die("connect failed!\n"); $stmt="insert into branch values('$usn','$name','$age');"; $sth=$dbh->prepare($stmt)||die("sql prepare failed!\n"); $sth->execute||die("insertion failed\n"); print"record insertion successfull"; print"<table border='1'>"; print" <tr> <th>USN</th> <th>Name</th> <th>Age</th></tr>"; $sh=$dbh->prepare("select * from branch"); $sh->execute(); while(($usn,$name,$age)=$sh->fetchrow()) { print"<tr><td>$usn</td><td>$name</td><td>$age</td></tr>"; } print"</table></body></html>"

T John Institute of Technology, Dept. of ISE, 2011-12

Page 38

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 39

Web Programming
Program 11: 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. prog11.php
<?php date_default_timezone_set('Asia/Calcutta'); $expire=time()+60*60*24*30; setCookie('lastVisit',date("G:i-m/d/y"), $expire); if(isset($_COOKIE["lastVisit"])) echo "You last visited on".$_COOKIE["lastVisit"]."!<br/>"; else echo "Welcome first time visitor"; ?>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 40

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 41

Web Programming
Program 12: 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.

prog12.php
<?php session_start(); session_register("count"); if(!isset($_SESSION)) { $_SESSION["count"]=0; echo "<p> Counter Initialised</p>\n"; } else { $_SESSION["count"]++; } echo"<p>The counter is now <b> $_SESSION[count]</b></p>". "<p>Relaod this page to increment</p>"; ?>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 42

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 43

Web Programming
Program 13: 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.

13.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 13</title> </head> <body> <form action="http://localhost/akhilaa/13insert.php" method="post"> <label> Enter name:</label> <input type="text" name="name"/> <br/> <label> Enter address1:</label> <input type="text" name="ad1"/> <br/> <label> Enter address2:</label> <input type="text" name="ad2"/> <br/> <label> Enter email:</label> <input type="text" name="email"/> <br/> <input type="submit" name="click"/> </form> </body> </html>

13insert.php
<html> <body> <?php $con=mysql_connect("localhost","root",""); if(! $con) { die('could not connect:'.msql_error()); } $name=$_POST['name']; $ad1=$_POST['ad1']; $ad2=$_POST['ad2']; $email=$_POST['email']; echo $name,$ad1,$ad2,$email; if($name!="" && $ad1!="") { mysql_select_db("person",$con)||die(mysql_error()); $query="INSERT INTO info VALUES('$name','$ad1','$ad2','$email')"; mysql_query($query) or die(mysql_error());

T John Institute of Technology, Dept. of ISE, 2011-12

Page 44

Web Programming
} else { echo "name and address fields are required"; } mysql_close($con); ?> <form action="http://localhost/akhilaa/13result.php" method="post"> NAME:<input type="text" name="name"/> <input type="submit"/> </form> </body> </html>

13result.php
<html> <body> <?php $con = mysql_connect("localhost","root",""); if (!$con) { die('Could not connect: ' . mysql_error()); } mysql_select_db("person", $con) or die(mysql_error()); $name=$_POST['name']; $result = mysql_query("SELECT * FROM info where name= '$name'")or die(mysql_error()); if(!$result) { echo "There is no records"; } echo "<table border='1'> <tr> <th>Name</th> <th>Addresss1</th> <th>Addresss2</th> <th>Email</th> </tr>"; while($row = mysql_fetch_array($result)) { echo "<tr>"; echo "<td>" . $row['name'] . "</td>"; echo "<td>" . $row['ad1'] . "</td>"; echo "<td>" . $row['ad2'] . "</td>"; echo "<td>" . $row['email'] . "</td>"; echo "</tr>"; } echo "</table>"; mysql_close($con); ?> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 45

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 46

Web Programming
Program 14: Using PHP and MySQL, develop a program 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.

14.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Program 14</title> </head> <body> <form action="http://localhost/akhilaa/14insert.php" method="post"> Accnum:<input type="text" name="accnum"/> <br/> Title:<input type="text" name="title"/> <br/> Author:<input type="text" name="author"/> <br/> Edition:<input type="text" name="edition"/> <br/> Publisher:<input type="text" name="publisher"/> <br/> <input type="submit" value="click"/> </form> </body> </html>

14insert.php
<?php $con=mysql_connect("localhost","root",""); if(! $con) { die('could not connect:'.msql_error()); } $accnum=$_POST['accnum']; $title=$_POST['title']; $author=$_POST['author']; $edition=$_POST['edition']; $publisher=$_POST['publisher']; echo $accnum,$title,$author,$edition,$publisher; if($accnum!="" && $title!="") { mysql_select_db("per14",$con)||die(mysql_error()); $query="INSERT INTO info VALUES('$accnum','$title','$author','$edition','$publisher')"; mysql_query($query) or die(mysql_error()); }

T John Institute of Technology, Dept. of ISE, 2011-12

Page 47

Web Programming
else { echo "accnum and title fields are required"; } mysql_close($con); ?> <form action="http://localhost/akhilaa/14result.php" method="post"> Accnum:<input type="text" name="accnum"/> <input type="submit"/> </form> </body> </html>

14result.php
<html> <body> <?php $con=mysql_connect("localhost","root",""); if(!$con) { die('could not connect:'.msql_error()); } mysql_select_db("per14",$con) or die(mysql_error()); $accnum=$_POST['accnum']; $result=mysql_query("SELECT * FROM info where accnum='$accnum'") or die(msql_error()); if(!$result) { echo "There is no record"; } echo"<tableborder='1'> <tr> <th>Name</th> <th>Address1</th> <th>Address2</th> <th>Email</th> </tr>"; while($row=mysql_fetch_array($result)) { echo "<tr>"; echo "<td>" . $row['accnum'] . "</td>"; echo "<td>" . $row['title'] . "</td>"; echo "<td>" . $row['author'] . "</td>"; echo "<td>" . $row['edition'] . "</td>"; echo "<td>" . $row['publisher'] . "</td>"; echo "</tr>"; } echo "</table>"; mysql_close($con); ?> </body> </html>

T John Institute of Technology, Dept. of ISE, 2011-12

Page 48

Web Programming
OUTPUT:

T John Institute of Technology, Dept. of ISE, 2011-12

Page 49

You might also like