Program 12

 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.



C:\INSTAN~1>CD C:\instantrails


C:\instantrails>PATH C:\instantrails\ruby\bin;C:\instantrails\mysql\bin;C:\Windo
ws\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPower
Shell\v1.0\;C:\Program Files\QuickTime\QTSystem\;C:\andriod\;C:\INSTAN~1\ruby\bi
n;C:\INSTAN~1\Apache;C:\INSTAN~1\PHP

C:\instantrails>cd rails_apps

C:\instantrails\rails_apps>dir
 Volume in drive C is New Volume
 Volume Serial Number is E821-51BD

 Directory of C:\instantrails\rails_apps

11/13/2013  08:19 PM    <DIR>          .
11/13/2013  08:19 PM    <DIR>          ..
10/29/2013  01:15 PM    <DIR>          .metadata
11/13/2013  08:05 PM    <DIR>          abc
11/13/2013  08:19 PM    <DIR>          abcd
10/29/2013  01:15 PM    <DIR>          cookbook
10/29/2013  01:25 PM    <DIR>          lab12
10/29/2013  01:15 PM    <DIR>          typo-2.6.0
               0 File(s)              0 bytes
               8 Dir(s)  42,111,426,560 bytes free



C:\instantrails\rails_apps>rails -d mysql ise
      create
      create  app/controllers
      create  app/helpers
      create  app/models
      create  app/views/layouts
      create  config/environments
      create  config/initializers
      create  db
      create  doc
      create  lib
      create  lib/tasks
      create  log
      create  public/images
      create  public/javascripts
      create  public/stylesheets
      create  script/performance
      create  script/process
      create  test/fixtures
      create  test/functional
      create  test/integration
      create  test/mocks/development
      create  test/mocks/test
      create  test/unit
      create  vendor
      create  vendor/plugins
      create  tmp/sessions
      create  tmp/sockets
      create  tmp/cache
      create  tmp/pids
      create  Rakefile
      create  README
      create  app/controllers/application.rb
      create  app/helpers/application_helper.rb
      create  test/test_helper.rb
      create  config/database.yml
      create  config/routes.rb
      create  public/.htaccess
      create  config/initializers/inflections.rb
      create  config/initializers/mime_types.rb
      create  config/boot.rb
      create  config/environment.rb
      create  config/environments/production.rb
      create  config/environments/development.rb
      create  config/environments/test.rb
      create  script/about
      create  script/console
      create  script/destroy
      create  script/generate
      create  script/performance/benchmarker
      create  script/performance/profiler
      create  script/performance/request
      create  script/process/reaper
      create  script/process/spawner
      create  script/process/inspector
      create  script/runner
      create  script/server
      create  script/plugin
      create  public/dispatch.rb
      create  public/dispatch.cgi
      create  public/dispatch.fcgi
      create  public/404.html
      create  public/422.html
      create  public/500.html
      create  public/index.html
      create  public/favicon.ico
      create  public/robots.txt
      create  public/images/rails.png
      create  public/javascripts/prototype.js
      create  public/javascripts/effects.js
      create  public/javascripts/dragdrop.js
      create  public/javascripts/controls.js
      create  public/javascripts/application.js
      create  doc/README_FOR_APP
      create  log/server.log
      create  log/production.log
      create  log/development.log
      create  log/test.log

C:\instantrails\rails_apps>cd ise

C:\instantrails\rails_apps\ise>mysql -u root

Welcome to the MySQL monitor.  Commands end with ; or \g.
Your MySQL connection id is 5 to server version: 5.0.27-community

Type 'help;' or '\h' for help. Type '\c' to clear the buffer.

mysql> create database ise_development;
Query OK, 1 row affected (0.01 sec)

mysql> create database ise_production;
Query OK, 1 row affected (0.00 sec)

mysql> create database ise_test;
Query OK, 1 row affected (0.00 sec)

mysql> use ise_development;
Database changed

mysql> create table webooks(
    -> id int not null auto_increment,
    -> title varchar(30),
    -> author varchar(30),
    -> publisher varchar(30),
    -> edition int,
    -> primary key(id));
Query OK, 0 rows affected (0.08 sec)

mysql> desc book;
+-----------+-------------+------+-----+---------+----------------+
|  Field         | Type             | Null   | Key |    Default |       Extra          |
+-----------+-------------+------+-----+---------+----------------+
| id              |  int(11)          | NO   |  PRI  | NULL    | auto_increment |
| title            | varchar(30)   | YES  |         | NULL     |                         |
| author        | varchar(30)   | YES  |         | NULL    |                         |
| publisher    | varchar(30)   | YES  |         | NULL    |                         |
| edition        | int(11)          | YES  |         | NULL    |                         |
+-----------+-------------+------+-----+---------+----------------+
5 rows in set (0.00 sec)

mysql> exit
Bye

C:\instantrails\rails_apps\ise>ruby script/generate scaffold Webook id:integer
title:string author:string publisher:string edition:integer
      exists  app/models/
      exists  app/controllers/
      exists  app/helpers/
      create  app/views/webooks
      exists  app/views/layouts/
      exists  test/functional/
      exists  test/unit/
      create  app/views/webooks/index.html.erb
      create  app/views/webooks/show.html.erb
      create  app/views/webooks/new.html.erb
      create  app/views/webooks/edit.html.erb
      create  app/views/layouts/webooks.html.erb
      create  public/stylesheets/scaffold.css
  dependency  model
      exists    app/models/
      exists    test/unit/
      exists    test/fixtures/
      create    app/models/webook.rb
      create    test/unit/webook_test.rb
      create    test/fixtures/webooks.yml
      create    db/migrate
      create    db/migrate/001_create_webooks.rb
      create  app/controllers/webooks_controller.rb
      create  test/functional/webooks_controller_test.rb
      create  app/helpers/webooks_helper.rb
       route  map.resources :webooks

C:\instantrails\rails_apps\ise>ruby script/server

=> Booting Mongrel (use 'script/server webrick' to force WEBrick)
=> Rails application starting on http://0.0.0.0:3000
=> Call with -d to detach
=> Ctrl-C to shutdown server
** Starting Mongrel listening at 0.0.0.0:3000
** Starting Rails with development environment...
** Rails loaded.
** Loading any Rails specific GemPlugins
** Signals ready.  INT => stop (no restart).
** Mongrel 1.1.2 available at 0.0.0.0:3000
** Use CTRL-C to stop.

IMP : 

White Color text indicates the code generated by the system.
RED Color indicates the command given by the user...

Program 11

 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> Program 11a </title>
</head>
<body bgcolor="#BBB777" text="black">
<h1> <center>Enter Student information </center></h1>

<center>
<FORM ACTION="11a.php" method="post" >
 <br><br><br>Name<br/> <INPUT TYPE=text NAME="name" /> <BR />
 <br>Address 1<br/><INPUT TYPE=text NAME="add1" /><BR />
 <br>Address 2 <br/> <INPUT TYPE=text NAME="add2" /><BR />
 <br> Email  <br/><INPUT TYPE=text NAME="email" /><BR /><br />
 <INPUT TYPE="submit" value="Submit" /> <INPUT TYPE="reset" value="Clear" />
</h2>
</center>
</FORM>
</body>
</html>


11a.php


<html>
<head><title>11a php program </title></head>
<body bgcolor="#BBB777" text="black">
<?php
$dbh = mysql_connect("localhost", "root","");
mysql_select_db("test1");
if(isset($_POST["name"]))
{
$name = $_POST["name"];
$add1 = $_POST["add1"];
$add2 = $_POST["add2"];
$email = $_POST["email"];
if($name != "" && $add1 != "" && $add2 != "" && $email != "")
{
$query = "INSERT INTO contact1 VALUES('$name','$add1','$add2','$email')";
$result = mysql_query($query);
echo "<h2>Data stored successfully.......<br /<br /><br/><br/>";
}
else
{
echo "<br /><h2>One of the field is empty.....<br /><br/><br/>";
}
}
mysql_close($dbh);
?>
<h2>
 <a href="11a.html">Click here to store more information -></a><br /><br /><br/><br/>
 <a href="11b.html">Click here to Retrive Student information -> </a>
</h2>
</body>
</html>


11b.html


<html>
<head>
<title>11b html program</title>
</head>
<body bgcolor="#BBB777" text="white">
 <h2>
<form action="11b.php" method="post">
<br /> Enter Student Name: <input type="text" name="name" />
<input type="submit" value="Submit" />
</form> <br/><br/>
<a href="11a.php">Go Back </a>
</h2>
</body>
</html>


11b.php


<html>
<head><title>11b php program </title></head>
<body bgcolor="#BBB777" text="black">
<h2><center><blink>Search Result</blink></center> <hr>
<?php
$link=mysql_connect("localhost","root","");
mysql_select_db('test1');
$name=$_POST["name"];
if($name == " " )
{
echo "<h2>Field is empty ....Enter the Name</h2>";
}
else
{
print "Entered Name is: $name <br /><br />";
$var=mysql_query("SELECT * FROM contact1 WHERE name like '%$name%'");
echo"<table border size=1>";
echo"<tr> <th>Name</th>
<th>Address 1</th>
<th>Address 2</th>
<th>E-mail</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_close($link);
?>
<h2>
<a href="11b.html">Click here to Retrive more information  </a></h2>
</h2>
</body>
</html>

Program 10

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");
?>

<html>
<body bgcolor="#FFF777">

<?php
$_SESSION["count"]++;

echo "<h3><center><br><br>You have visited this page ".$_SESSION["count"]." times  during this SESSION</center></h3>";
?>

</body>
</html>

Program 9

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

date_default_timeZone_set('Asia/Calcutta');
$inTwoMonths=60*24*60+time();
setcookie('lastVisit',date("G:i-m/d/y"),$inTwoMonths);
if(isset($_COOKIE['lastVisit']))
{
$visit=$_COOKIE['lastVisit'];
echo "Your last visit was -".$visit;
}
else
echo "you ve got some stale cookies!";

?>

Program 8

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>
<head>
 <title>lab10</title>
</head>
<body bgcolor="#BBB777" text="black">
<h1> <center>Enter Student  information </center></h1>

<center>
<form action="8.pl">
<br/> NAME<br/><input type="text" name="name"><br><br>
 <br/>AGE <br/><input type="text" name="age"><br><br>
<input type="submit" value="Submit"></h2>
</form>
</center>

</body>
</html>


8.pl

#! /usr/bin/perl -w
use CGI ':standard';
use DBI;
print "content-type:text/html\n\n";
$name=param("name");
$age =param("age");
$dbh=DBI->connect("DBI:mysql:dbase1","root","");
$res1=$dbh->prepare("insert into pdetails values('$name','$age')");
$res1->execute();
$res=$dbh->prepare("select * from pdetails");
$res->execute();
print "<html><body bgcolor=#BBB777 text=black>";
print "<h2><center><br>THE CONTENTS OF THE DATABASE TABLE IS SHOWN BELOW <hr> <br>";
print "<table border=1>";
print "<tr><td>NAME</td><td>Age</td></tr>";
while(@a=$res->fetchrow_array())
{
print "<tr><td>$a[0]</td><td>$a[1]</td></tr>";
}
print "</table></center></h2></body></html>";

Program 7

7.

Write a Perl program to display a digital clock which displays the current time of the server.


#! c:/perl/bin/perl -w

use CGI  ':standard';
print "Refresh: 1\n";
print "Content-Type: text/html\n\n";
print start_html(-title=>"Program 7",-bgcolor=>"Silver",-text=>"Yellow"); ($s,$m,$h)=localtime(time);
#to get the current time
print br,br,"The current system time is $h:$m:$s";
print br,br,hr,"In words $h hours $m minutes $s seconds";

print end_html;

Program 6 (b)

6 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.


#! /usr/bin/perl
use CGI ':standard';
print "content-type:text/html","\n\n";
print "<html><head><title>6b </title></head>";
print "<body bgcolor=silver  text=white >";
open(IN,"<visit");
$count=<IN>;
close(IN);
open(OUT,">visit");
$count++;
print OUT $count;
close(OUT);
print "<center><b> You are the visitor number: $count </center> </b>";
print " </body></html>";
exit(0);

Program 6 (a)

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.

#! usr/bin/perl -w
use CGI ':standard';
use CGI::carp qw(WarningsToBrowser);
@coins=("welcome to web programming lab","have a nice day","practise all programs","well done");
$range=4;
$random_number=int(rand($range));
if(param)
{
print header();

print start_html(-title=>"username",-bgcolor=>"pink",-text=>"blue");

$cmd=param("name");

print b("hello $cmd,$coins[$random_number]"),br();
print start_form();
print submit(-value=>"back");
print end_form();
print end_html();
}
else
{
print header();
print start_html(-title=>"enter user name",-bgcolor=>"silver",-text=>"black");
print start_form(),textfield(-name=>"name",-value=>" "),submit(-name=>"submit",-value=>"submit"),reset();
print end_form();
print end_html();
}

Program 5 (b)

5 b)

Write a Perl program to accept UNIX command from a HTML form and to display the output of the command executed.

5b.html


<html>
<body>
<form action="http://localhost/cgi-bin//5b.pl">
<input type="text" name="com">
<input type="submit" name="submit">
</form>
</body>
</html>


5b.pl


#! C:/perl/bin/perl -w

use CGI ':standard';
print "content-type: text/html \n\n";
$c=param('com');
system($c);

exit(0);

Program 5 (a)

5 a)

 Write a Perl program to display various Server Information like Server Name, Server Software, Server    protocol, CGI Revision etc.


#! C:/Perl/bin/perl -w

use CGI':standard';
print "content-type:text/html","\n\n";
print "<html>\n";
print "<head><title> About this server </title> </head>\n";
print "<body><h1> About this server </h1>","\n";
print "<hr>";
print "Server name:",$ENV{'SERVER_NAME'},"<br>";
print "Running on port :",$ENV{'SERVER_PORT'},"<br>";
print "Server Software :",$ENV{'SERVER_SOFTWARE'},"<br>";
print "CGI-Revision :",$ENV{'GATEWAY_INTERFACE'},"<br>";
print "<hr>\n";
print "</body></html>\n";

exit(0);

Program 4 (b)

4 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="utf-8"?>
<?xml-stylesheet type="text/xsl" href="4b.xsl"?>
<vtu>
<student>            
<name>wxyz</name>
<usn>1ST10IS700</usn>      
<collegeName>SaIT</collegeName>      
<branch>ISE</branch>      
<year>2010</year>      
<email>wxyz@gmail.com</email>
</student>
</vtu>

4b.xsl


<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<style>
.svalue{font-style:bold;font-size:20px;color:yellow;}
.shead{font-style:italic;font-size:20px;color:#DDFFCC;}
h2{color:white;}
body{background-color:silver;}
</style>
<h2>VTU Student Information</h2>  
<table border="1">    
<tr bgcolor="#CCCCCC">      
<th><span class="svalue">Name </span></th>      
<th><span class="svalue">Usn</span></th>      
<th><span class="svalue">CollegeName</span></th>      
<th><span class="svalue">Branch</span></th>      
<th><span class="svalue">Year</span></th>      
<th><span class="svalue">E-mail</span></th>        
</tr>      
<xsl:for-each select="vtu/student">    
<tr>      
<td><span class="shead"><xsl:value-of select="name"/></span></td>      
<td><span class="shead"><xsl:value-of select = "usn" /></span></td>
<td><span class="shead"><xsl:value-of select="collegeName"/></span></td>      
<td><span class="shead"><xsl:value-of select="branch"/></span></td>      
<td><span class="shead"><xsl:value-of select="year"/></span></td>      
<td><span class="shead"><xsl:value-of select="email"/></span></td>    
</tr>  
</xsl:for-each>      
</table>
</body>
</html>
</xsl:template>

</xsl:stylesheet>

Program 4 (a)

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>
<h1> Student Information </h1>
<h3>Student 1</h3>

    <VTU>

       <label>USN: <usn> 1ST10IS501<br/> </usn></label><br/>

       <label>NAME: <name> ramesh </name></label><br/>

       <label>COLLEGE: <college> SAIT </college></label><br/>

       <label>BRANCH: <branch> ISE</branch></label><br/>

       <label>YEAR of JOINING:<YOJ> 2010 </YOJ></label><br/>

       <label>EMAIL: <email> ramesh@gmail.com </email></label><br/>

    </VTU>

 <h3>Student 2</h3>

    <VTU>

       <label>USN : <usn> 1ST10IS502</usn></label>

       <label>NAME: <name> suresh</name></label>

       <label>COLLEGE: <college> SAIT </college></label>

       <label>BRANCH: <branch> ISE </branch></label>

       <label>YEAR of JOINING: <YOJ> 2010 </YOJ></label>

       <label>EMAIL : <email> suresh@gmail.com</email></label>

    </VTU>

  <h3>Student 3</h3>

    <VTU>

       <label>USN :<usn>1ST10IS503</usn></label>

       <label>NAME <name> raghu </name></label>

       <label>COLLEGE: <college> SAIT</college></label>

       <label>BRANCH: <branch> ISE </branch></label>

       <label>YEAR of JOINING: <YOJ> 2010</YOJ></label>

       <label>EMAIL: <email> raghu@yahoo.com </email></label>

    </VTU>

   </students>

4a.css

usn {color:red; font-size:12pt;font-style:bold; margin-left: 15px;<br>;}

name {color:red; font-size:12pt; margin-left: 15px;}

college {color:red; font-size:12pt; margin-left: 15px;}

branch {color:red; font-size:12pt; margin-left: 15px;}

YOJ {color:red; font-size:12pt; margin-left: 15px;}

email {color:red; font-size:12pt; margin-left: 15px;}

h1 {color:red;font-size:18pt;}

h3 {display:block;color:blue;font-size:16pt;}

Program 3 (b)

3 b)

 Modify the above 3(a) program 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>
<meta http-equiv="content-type" content="text/html";charset="UTF-8">
<title>stacking</title>
<style type="text/css">

.layer1style{
border:solid thick orange;
padding:1em;
width:500px;
height:100px;
background-color:pink;
position:absolute;
top:220px;
left:250px;
z-index:0;
}
.layer2style{
border:solid thick white;
padding:1em;
width:600px;
height:100px;
background-color:blue;
position:absolute;
top:270px;
left:280px;
z-index:0;
}
.layer3style{
border:solid thick green;
padding:1em;
width:700px;
height:100px;
background-color:purple;
position:absolute;
top:320px;
left:310px;
z-index:0;
}
</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>

</a><br/>
<br>

<div style="z-index:1;" class="layer1style" id="layer1" onmouseover="mover('layer1','1')" onmouseout="moveBack()">
ACER</div>
<div style="z-index:2;" class="layer2style" id="layer2" onmouseover="mover('layer2','2')" onmouseout="moveBack()">
LENOVO </div>
<div style="z-index:3;" class="layer3style" id="layer3" onmouseover="mover('layer3','3')" onmouseout="moveBack()">
HP</div>

</body>
</html>

Program 3 (a)

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>stacking</title>

<style type="text/css">

.layer1style{
border:solid thick orange;
padding:2em;
width:500px;
height:100px;
background-color:pink;
position:absolute;
top:300px;
left:250px;
z-index:0;
}
.layer2style{
border:solid thick white;
padding:2em;
width:600px;
height:100px;
background-color:blue;
position:absolute;
top:350px;
left:280px;
z-index:0;
}
.layer3style{
border:solid thick green;
padding:2em;
width:700px;
height:100px;
background-color:purple;
position:absolute;
top:400px;
left:310px;
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>


<div style="z-index:1;" class="layer1style" id="layer1" onmouseover="mover('layer1','1')">
     acer    </div>
<div style="z-index:2;" class="layer2style" id="layer2" onmouseover="mover('layer2','2')" >
lenovo</div>
<div style="z-index:3;" class="layer3style" id="layer3" onmouseover="mover('layer3','3')">
HP</div>
</center>
</body>
</html>

Program 2 (b)

2  b) Modify the 2 a)  program to get the current semester also (restricted to be a number from 1 to 8)

<html >

<script type="text/javascript">
function chkusn()
{
var str=document.getElementById("usn");
var result=str.value.search(/^[1-4]{1}[A-Z]{2}\d{2}[A-Z]{2}\d{3}$/);
var stsem=document.getElementById("sem");
var pos=stsem.value.search(/^[1-8]{1}$/);
if(result >= 0 && pos >= 0)
{
alert("entered usn ("+str.value+") is in the correct form \n" +" entered sem("+stsem.value+")is in the correct form\n");
}
else if(result != 0 && pos>= 0)
{
alert ("entered usn("+str.value+") is not in correct form \n"+" the correct path is 1ST10IS039\n"+"please go back and re enter your USN");
}
else if(result >= 0 && pos != 0)
{
alert("entered sem("+stsem.value+")is  not in the correct range \n" + "the range is between 1 to 8 \n");
}
else
{
alert ("entered usn("+str.value+") is not in correct form \n"+" the correct path is 1ST10IS039\n"+"entered sem("+stsem.value+")is  not in the correct range \n" + "the range is between 1 to 8 \n " + "please go back and re enter your USN,SEM");
}
}
</script>

</head>
<center>

<form name="my form">
<p style="color:red;font-size:28px"> <bold>ENTER YOUR USN</bold> </p>
<input type="text" id="usn" size=28 />
<br/><p style="color:red;font-size:28px"> <bold>ENTER YOUR SEM</bold> </p>
<input type="text" id="sem" size=28 />
<br><br><br>
<input type="button" onclick="chkusn()" value="validate"/>
<input type="reset" value="reset" />
<br/>
</form>

</center>
</html>

Program 2 (a)

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> usn </title>
<body>

<script>
function chkusn()
{
var str=document.getElementById("usn");
var result=str.value.search(/^[1-4]{1}[A-Z]{2}\d{2}[A-Z]{2}\d{3}$/);
if(result!=0)
{
alert("Entered USN  ("+str.value+")  is not in the correct form \n\n"+"\tThe correct path is 1ST10IS039\n\n"+"\t Please press reset button to re-enter your USN");
}
else
{
alert ("Entered USN ("+str.value+") is in correct form \n");
}
}
</script>

<center>
<h3>STUDENT    INFORMATION </h3>    

<form name="my form">
<p> <bold>ENTER YOUR USN</bold> </p>
<input type="text" id="usn" />
<br/><br/>
<input type="button" onclick="chkusn()" value="submit"/>
<input type="reset" value="reset"/>
</center>
</br>
</form>

</body>  
</html>

Program 1 (b)

1 b)

Develop and demonstrate a XHTML file that includes Javascript script
for the following problems:
Input:     A number n obtained using prompt
Output:  A table of numbers from 1 to n and their squares using alert


<html>
<body>
<center>
<script>
function square()
{
var n=prompt("Enter the Number"," ");
str1="No--------------------Square\n";
n=parseInt(n);
if(n>0)
{
for(i=0;i<n+1;i++)
{
temp=i*i;
str1=str1+i+"----------------------"+temp+"\n";
}
alert(str1);
}
else alert("Enter a number greater than 1.")
}
</script>
<body>
<form>
<br><br><br>
<input type="button" value="Enter Number" onclick="square()";>
</form>
</center>
</body>
</html>


 

Program 1 (a)

1  a)
        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


<html >
<head>
<title> Fibonacci Numbers </title>
</head>
<body>
<center>
<h1>Calculating the fibonacci numbers</h1>
<script type="text/javascript">
var n,a=0,b=1,i,c
n=prompt("Enter a number ","")
if(n<=0) alert("Invalid number")
else
{
if(n==1) document.write(a)
else document.write(a+"<br />"+b)
for(i=2;i<n;i++)
{
c=a+b
a=b
b=c
document.write("<br />"+c)
}
}
</script>
</center>
</body>
</html>