practical 2 wad

Web Application Development 160705

TAPAN SHAH/130953131010 Page 51

LIST OF PRACTICALS

PRACTICAL 2 JAVASCRIPT

Date: 30.1.2015 Submission Date: 18.3.2015

1. Given the following table of data about several planets of our solar system, create a Web page that enables users to enter a planet

name and, at the click of a button, have the distance and diameter appear either in an alert box or in separate fields of the page.

Planet Distance from the sun Diameter

Mercury 36 million miles 3,100 miles

Venus 67 million miles 7700 miles

Earth 83 million miles 7920 miles

Mars 141 million miles 4200 miles

Code:-

Measure Distance

Enter The Planet Name:

Distance from Sun:

Diameter:

function check()

{

var name = document.getElementById("name").value;

if(name=="Mercury")

{

document.getElementById("mi").value="36 million miles";

document.getElementById("dia").value="3,100 miles";

}

else if(name=="Venus")

{




2. Create a page that prompts the user for his or her name as the

page loads(via a dialog box) and then welcomes the user by name

in the body of the page.

Code:-

Welcome a user

function Wel()

{

var name=window.prompt("Enter your Name");

document.writeln("Welcome "+name);

}

OUTPUT:-



3. A large company pays its salespeople on a commission basis. The

salespeople receives Rs 200 per week, plus 9 percent of their gross

sales for that week. For example, a salesperson who sells Rs. 5000

worth of merchandise in a week receives Rs.200 plus 9 percent of

Rs. 5000, or a total of Rs. 650. You have been supplied with a list of

items sold by each salesperson. The values of these items are as

follows.

Item Value

1 239.99

2 129.75

3 99.95

4 350.89

Code:-

Salary Calculation.

Please Enter Quantity of Items Prices are:

Item 1: 239.99

Item 2: 129.75

Item 3: 99.95

Item 4: 350.89

Total:

var flag;

function calc()

{

var total;

var q = []

q[0]=document.getElementById("i1").value;




var regex=/^[0-9]+$/;

for(var i=0;i



{

flag=0;

}

else

flag=1;

}

var price = []

price[0] = 239.99;

price[1] = 129.75;

price[2] = 99.95;

price[3] = 350.89;

total=1;

if(flag==0)

{

for(var i=0;i



4. Write a script that calculates the product of the odd integers from 1

to 15 then outputs XHTML text that displays the result.

Code:-

Odd Integers.

function calc()

{

document.writeln("Odd Numbers with their product

");

var no=1;

for(var i=0;i



5. Implement the following functions:

a. Function celsius returns the Celsius equivalent of a Fahrenheit

temperature, using the calculation

C = 5.0/9.0 * (F - 32)

b. Function Fahrenheit returns the Fahrenheit equivalent of a

Celsius temperature, using the calculation

F = 9.0 /5.0 * C + 32

c. Use these functions to write a script that enables the user to

enter either a Fahrenheit or a Celsius and one to initiate the

conversion from Celsius or Fahrenheit equivalent.

Your XHMTL document should contain two buttons one to initiate the

conversion from Fahrenheit to Celsius and one to initiate the

conversion from Celsius to Fahrenheit.

Code:-

Calculate Temperature.

Fahrenheit

Celsius

Fahrenheit

Celsius



var regex=/^[0-9]+$/;

function o1()

{

document.getElementById("p1").style.visibility="visible";

document.getElementById("f").style.visibility="visible";

document.getElementById("c").style.visibility="visible";

document.getElementById("c").disabled=true;


document.getElementById("btn2").style.visibility="visible";

document.getElementById("btn1").style.visibility="hidden";

document.getElementById("f").disabled=false;

document.getElementById("f").value="";

document.getElementById("c").value="";

}

function o2()

{


document.getElementById("c").style.visibility="visible";

document.getElementById("f").style.visibility="visible";

document.getElementById("f").disabled=true;


document.getElementById("btn1").style.visibility="visible";

document.getElementById("btn2").style.visibility="hidden";

document.getElementById("c").disabled=false;

document.getElementById("f").value="";



far = (9.0 /5.0 * (parseFloat(cel)) + 32);

document.getElementById("f").value=far;

}

else

{

alert("Invalid Data Type");

}

}

OUTPUT:-



6. (Airline Reservations Systems) A small airline has just purchased a

computer for its new automated reservation system. You have been

asked to program the new system. You are to write a program to

assign seats on each flight of the airlines only plane (capacity: 10

seats).

Your program should display the following menu of

alternatives: Please type 1 for First Class and Please type 2

for Economy. If the person types 1, your program should

assign a seat in the first-class section (seats 1-5). If the

person types 2, your program should assign a seat in the

economy section (seats 6 - 10). Your program should print a

boarding pass indicating the persons seat number and

whether it is in the first-class or economy section of the plane.

Use a one-dimensional array to represent the seating chart of

the plane. Initialize all the elements of the array to 0 to

indicated that all the seats are empty. As each seat is

assigned, set the corresponding elements of the array to 1 to

indicate that the seat is no longer available.

Your program should, of course, never assign a seat that has

already been assigned. When the first-class section is full,

your program should ask the person if it is acceptable to be

placed in the economy section (and vice versa). If yes, then

make the appropriate seat assignment. If no, then print the

message Next Flight leaves in 3 hours. .

Code:-

Airline Booking.

var fc=0;

var eco=0;



var nno=5;

var i=0;

var seats = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ];

var booked="Booked Seats #";

var fcp=0;

var ecop=5;

var s;

function checkper()

{

var sel=parseInt(document.getElementById("s").value);

var no=parseInt(document.getElementById("n").value);

if(sel==1)

{

if((nno-fc)>=no)

{

nno=5;

for(i=fcp; i



alert(booked);

}

else

{

if(confirm("First class has only "+(nno-fc)+" Seat "+"

Economy class has "+(nno-eco)+" seasts")==true)

{

alert("Enter No. of Seats");

document.getElementById("s").value=2;

document.getElementById("n").value="";

}

}

}

else if(sel==2)

{

if(Math.abs(nno-eco)>=no)

{

nno=5;

for(i=ecop; i



}

}

ecop=eco+5;

alert(booked);

}

else

{

alert("Next Flight Leaves in 3 Hours. Economy has only

"+(nno-eco)+" Seat");

}

}

else

{

alert("invalid input");

}

}

function printp()

{

document.getElementById("s").value="";

document.getElementById("n").value="";

document.getElementById("pr").innerHTML="The below are

the booked Seats: "+""+booked;

}

Enter 1 for First class Enter 2 for Economy class



Enter no. of seats

OUTPUT:-



7. Write a script that uses random number generation to create

sentences. Use four arrays of strings called article, noun, verb, and

preposition. Create a sentence by selecting a word at random from

each array in the following order: article, noun, verb, preposition,

article, noun. As each word is picked, concatenate it to the previous

words in the sentence. The words should be separated by spaces.

When the final sentence is output, it should start with a capital

letter and end with a period.

The arrays should be filled as follows: the article array should

contain the articles the,a,one,some and any; the noun

array should contain the nouns boy,girl,dog,town, and car;

the verb array should contain the verbs

drove,jumped,ran,walked, and skipped; the prepositions

to,from,over,under and on.

The program should generate 5 sentences to form a short story and

output the result to an XHTML textarea. The story should begin with

a line reading Once upon a time and end with the line reading

THE END.

Code:-

Use of random.

function call()

{

document.getElementById("t1").value="Once upon a time.... ";



for (i = 0; i < 5; i++)

{

article = new Array("the", "a", "one", "some", "any");

noun = new Array("boy", "girl", "dog", "town", "car");

verb = new Array("drove", "jumped", "ran", "walked",

"skipped");

preposition = new Array("to", "from", "over", "under", "on");

var rand1 = [Math.floor ( Math.random() * article.length )];

var rand2 = [Math.floor ( Math.random() * noun.length )];

var rand3 = [Math.floor ( Math.random() * verb.length )];

var rand4 = [Math.floor ( Math.random() * preposition.length

)];

var rand5 = [Math.floor ( Math.random() * article.length )];

var rand6 = [Math.floor ( Math.random() * noun.length )];

document.getElementById("t1").value+=article[rand2].replace(/^[

a-z]/,function(m){return m.toUpperCase()}) + " " +

noun[rand2].replace(/^[a-z]/,function(m){return

m.toUpperCase()}) + " " +

verb[rand3].replace(/^[a-z]/,function(m){return


preposition[rand4].replace(/^[a-z]/,function(m){return


article[rand5].replace(/^[a-z]/,function(m){return


noun[rand6].replace(/^[a-z]/,function(m){return

m.toUpperCase()}) + ". ";

}

document.getElementById("t1").value+=" THE END";



}

OUTPUT:-



8. Create a page that includes SELECT object to change the

background color of the current page. The property that you need

to set is document.bgColor, and the three values you should offer

as option are red, yellow, green. In the SELECT object, the colors

should display as Stop, Caution and Go.

Code:-

Colour Signals.

function call()

{

var e = document.getElementById("color1");

var col = e.options[e.selectedIndex].value;

document.bgColor=col;

}

Stop

Caution

Go

OUTPUT:-



9. Create a page that has two fields and one button. The button should

trigger a function that generates two random numbers between 1

and 6, placing each number in one of the fields.

Code:-

Math.Random.

function check()

{

var n1=Math.floor(Math.random() * 6) + 1

var n2=Math.floor(Math.random() * 6) + 1

if(n1==n2)

{

n2=Math.floor(Math.random() * 6) + 1

}

document.getElementById("n1").value=n1;

document.getElementById("n2").value=n2;

}



OUTPUT:-



10. Write a script that contains a button and a counter in a div. The

button should increment the counter each time it is clicked.

Code:-

Counter

var n=0;

function check()

{

n++;

document.getElementById("cn").innerHTML=n;

}

Counter



OUTPUT:-

practical 2 wad

Documents