Scribd
Upload
67 views

University of Mauritius: Web Technology I (Cse1041) Test

This document contains instructions and questions for a web technology test. It includes questions about: 1) Creating HTML code for frames-based web pages with different specifications. 2) Writing JavaScript validation functions to check for blank fields and password formatting. 3) Linking an HTML form to external JavaScript functions and calling functions on form submit. The questions require writing HTML, CSS, and JavaScript code snippets to fulfill tasks like form validation, checking field values, and displaying messages. Code is needed for pages, functions, styling, and form processing.

Uploaded by

splokbov
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
67 views

University of Mauritius: Web Technology I (Cse1041) Test

This document contains instructions and questions for a web technology test. It includes questions about: 1) Creating HTML code for frames-based web pages with different specifications. 2) Writing JavaScript validation functions to check for blank fields and password formatting. 3) Linking an HTML form to external JavaScript functions and calling functions on form submit. The questions require writing HTML, CSS, and JavaScript code snippets to fulfill tasks like form validation, checking field values, and displaying messages. Code is needed for pages, functions, styling, and form processing.

Uploaded by

splokbov
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

University of Mauritius

WEB TECHNOLOGY I (CSE1041) TEST

Time Limit: 1 hour Date: March 2011 Max Marks: 30

Answer ALL questions, use blue/black pens only

Question 1 [15 marks]


Consider the Home.html web page below, which consists of 4 frames linked to:
Header.html, Menu.html, Summer.html and Pictures.html.
Header.html

My Hobbies 25%

75%

25% 45% 30%

Menu.html Summer.html Pictures.html

The specifications of each page are given below:


HTML page Specifications
Home.html Ø This page specifies the arrangement of the frames,
i.e. the number of columns and rows.
Header.html Ø This page consists of a Level 1 Heading (see above)
menu.html Ø This page has three hyperlinks that open the
following pages: Summer.html, Winter.html and
Others.html.
Ø The links open in the frame Summer.html
Summer.html Ø This frame is used to display the contents of the
Summer Hobbies. It consists of a Level 2 Heading
and normal text (See above)
Pictures.html Ø This page will be used to view pictures

1|Page
(a) Write the html codes for the following pages:
(i) Home.html [5 marks]
(ii) Summer.html [4 marks]

(b) Assuming that Pictures.html will contain the images pic1.gif and pic2.gif, write html
codes for showing the images on Pictures.html.

Note:
• Each picture should appear on a different line
• You are NOT requested to write the whole web page.
• All images are saved in the folder images found in the same directory as the html
pages.
[2 marks]

(c) Assuming we have the external CSS file myCSS.css, write the proper codes which
should be inserted in Summer.html to link it to myCSS.css.
Note:
• myCSS.css is store in the folder cssFiles found in the same directory as the html
page.
• You are NOT requested to write the whole web page.
[2 marks]

(d) Assuming Summer.html is linked to the css file myCSS.css (See part (c) above), use
CSS Inline to override the option “Music” with:
• Colour - Red
• Text - Uppercase.
[2 marks]

2|Page
Question 2 [15 marks]
(a) Consider the following screenshot and the codes for login.html below:

Screenshot:

Login.html:
<head>
<body>
<form id=frm_feedback action="test.html" method="post">
<table border="1" align="middle">
<tr>
<td>Username</td>
<td><input type=text name="txt_Username"
onblur="validateBlank(this.value,'Username');"></td>
</tr>

<tr>
<td>Password</td>
<td><input type=password name="txt_pwd"
onblur="validatePassword(this.value,'Password');"></td>
</tr>
<table>
</form>
</body>
</html>

(i) Write the codes for the function validateBlank (called in Login.html above),
which checks if the Username is Blank and outputs the following popup if the
username is blank:

[3 marks]

3|Page
(ii) Write the codes for function validatePassword which will do the following:
• Check if the password is blank by calling the function validateBlank in
part (i) above
• If the password is not blank, it only accepts passwords starting with a
letter (lowercase or uppercase) and followed by digits. If this is not
successful it will output the following error message:

E.g of Valid passwords: s1223, G232, t4


E.g of Invalid passwords: 333, ss3434, sdsd, s3434s
[5 marks]

(b) Consider the screenshot for the form below and the corresponding codes for Form1.
html:

Screenshot

Form1.html
<html>
<head>
</head>
<body>
<form id=frm_feedback action="test.html" method="post">
<table border="1" align="middle">
<tr>
<td>value 1</td>
<td><input type=text name="txt_val1"
onblur="chkBlank(txt_val1.value);"></td>
</tr>

<tr>
<td>value 2</td>
<td><input type=text name="txt_val2"
onblur="chkBlank(txt_val2.value);"></td>

4|Page
</tr>

<tr>
<td colspan="2" align="center"><input type=button
name="Check" value="check">
<input type=reset name=reset>
</td>
</tr>
</table>
</form>
</body>
</html>

(i) Insert the appropriate codes in Form1.html to link it to the file Exercise.js (stored
under the same folder as Form1.html). Exercises.js contains all the javascript
functions used in Form1.html .

Note: You need not write the whole html file again.
[2 marks]

(ii) When the button check is clicked, the function chkmax is called. chkmax takes
two parameters as input; the values entered for value 1 and value 2. Insert the
appropriate codes in Form1.html to call the function chkmax.

Note: You need not write the whole html file again.
[2 marks]

(iii) Consider the function chkMin below.

function chkMin(val1,val2)
{
if (val1<val2)
{
return val1;
}
else
{
return val2;
}
}

The function disp takes as input the values entered for value 1 and value 2
and calls the function chkmin to display the message:

Value … is smaller

depends on the return value of chkMin

Write the javascript codes for the function disp.


[3 marks]

5|Page

You might also like