Universiti

J
Malaysia
PAHANG
Engineering Technology Creativity
FACULTY OF COMPUTER SYSTEMS & SOFTWARE ENGINEERING
FINAL EXAMINATION
COURSE: WEB SCRIPTING
COURSE CODE: BCS2303
LECTURER: NG CHOON CHING
DATE: 12 JUNE 2012
DURATION: 3 HOURS
SESSION/SEMESTER : SESSION 2011/2012 SEMESTER II
PROGRAMME CODE : BCS/BCN
INSTRUCTIONS TO CANDIDATE:
1. This question paper consists of THREE (3) Sections: Sections A, B, and
C. Answer ALL questions.
2. Write your answers in the answer booklet provided.
3. Answer EACH question from Sections B and C on a new page.
4. All calculations and assumptions must be clearly shown.
EXAMINATION REQUIREMENTS:
NONE
DO NOT TURN THIS PAGE UNTIL YOU ARE TOLD TO DO SO
This examination paper consists of FIFTEEN (15) printed pages including the front
page.
CONFIDENTIAL

BCSIBCNI1112IIIBCS2303
SECTION A

[15 MARKS]
Choose the correct answer.
1. HTML (HyperText Markup Language) is a special type of computer language
called a(n) language designed to specify the content and structure of
web pages (also called documents) in a portable manner.
A. scripting
B. markup
C. object-oriented programming
D. procedural programming
2. is used to specify the presentation, or styling, of elements on a web
page (e.g., fonts, spacing, sizes, colors, positioning).
A. HyperText Markup Language (HTML5)
B. Cascading Style Sheets (CSS)
C. JavaScript
3. simplifies JavaScript programming by making it easier to manipulate a
web page's elements and interact with servers in a portable manner across various
web browsers.
A. jQuery
B. JavaScriptQuery
C. CSS3
FWKWIN
CONFIDENTIAL

BCS/BCN/11 1211/BCS2303
4. The? in the URL www.google.com/search?q=deitel separates the
from the rest of the URL in a request.
A.UIU
B. post request
C. query string
D. cache
5. HTIvIL5 text is marked up with delimited by that are
keywords contained in pairs of________
A. elements, angle brackets, tags
B. angle brackets, elements, tags
C. tags, elements, angle brackets
D. elements, tags, angle brackets
6. A link to an e-mail address is created using the notation
<a href =">Paul</a>.
A. @LAUNCH email
B. mailto: emailAddress
C. email: emailAddress
D. emailAddress
7. Which statement is FALSE?
A. The & code; syntax is reserved for special characters.
B. The del element is used to delete text.
C. The sup and sub elements are used to denote superscript and subscript
characters.
D. The hr element introduces a horizontal rule.
3
CONFIDENTIAL

BCS/BCN/111211/BCS2303
8. Which of the following is the MOST accurate statement concerning internal
hyperlinks?
A. The "internal" refers to the internal contents of a table
B. Internally-linked location names can be assigned to any point in an HTML5
file
C. href = "page. html&name" is the proper format used to link to an internal
location of another page
D. The "internal" refers to the host machine on which the browser is running
9. The attribute places the cursor in a specified text field after the browser
loads and renders the page.
A. required
B. placeholder
C. value
D. autofocus
10. An example of the CORRECT format for inline styles is:
A. <p style = "font-size = 20pt">
A. <p font-style = "20pt">
B. <p style: "font-size = 20pt">
C. <p style = "font-size: 20pt">
11. Which of the following selections is the proper way to apply this CSS rule:
.blue { color: blue
A. <p color = "blue">
B. <p class = "blue">
C. <p color = .blue>
D. <p class = .blue>
4
CONFIDENTIAL

BCS/BCN/1 1 12111BCS2303
12. Which of the following statements would correctly print out the sentence "Hello
World" in blue?
A.
document.write("<p style = \"color: blue\");
document.write(" HellO
World >");
B.
document.write("<p> style = \"color: blue\" Hello World </p>);
C.
document.write('<p style = \"color: blue\" Hello World +
"</p>")
D.
document.write("<p style = \"color: blue\">");
document.write("Hello World </p>");
13. What would the browser display if the following code as shown in Figure 1 were
executed in a script?
var x = 11;
var y = 14;
if ( x > 13
if ( y > 13
document.writeln( "x and y are > 13" );
else
document.writeln(
! ! X
is <= 13" );
Figure 1
A. nothing
B. 11
C. x and y are > 13
D. x is <= 13
5
CONFIDENTIAL

BCS/BCN/11 1211/BCS2303
14. What will the browser display if the following script as illustrated in Figure 2 is
executed and the user enters 5 at both prompts?
<script type = "text/javascript">
<!--
var firstNumber = window.prompt(
var secondNumber= window.prompt(
var thirdNumber;
thirdNumber = firstNumber + seco
document.write( thirdNumber );
1/-->
"Enter an integer", "0" );
"Enter an integer", "0" );
ndNumber;
</script>
Figure 2
A. nothing
B. 0
C. 10
D.55
15. Choose the CORRECT statement that refers to the SQL query given in Figure 3.
SELECT lastName FROM Authors
WHERE iastName LIKE '%e'
Figure 3
A. selects from the table Authors the lastName fields which start with any
single character followed by an 'e', then any number of additional characters.
B. selects from the table Authors the lastName fields which start with either
the letter e followed by any number of additional characters.
C. selects from the table Authors the lastName fields which constist of any
number of characters followed by an 'e' and any single character.
D. selects from the table Authors the lastName fields which end with the letter
'e'.
CONFIDENTIAL

BCS/BCN/1 11211/BC S2303

SECTION B

[55 MARKS]
QUESTION 1

[14 Marks]
A well-rounded web designer needs to understand many of the technical and artistic
aspects of web design, although not necessarily needing to specialize in both.
(a) Describe TWO (2)
factors of aesthetic a web designer needs to consider during
the development.
[4 Marks]
(b)
Describe the important of learning from the usage statistics as part of the design
requirements?
[2 Marks]
(c)
Give the reason that a key factor in the usability of a site is its navigation?
[2 Marks]
(d) Give THREE (3) methods of usable designing.
[6 Marks]
7
CONFIDENTIAL

BCS/BCN/1 11211/BCS2303
QUESTION 2

[9 Marks]
Web application has been widely used in content management system, customer
relationship management, decision support system, online retail sales, forum, social
networks and perform many other functions.
(a)
Draw a diagram to illustrate the Model View Controller (MVC) of web
application.
[3 Marks]
(b)
Explain each phase of the model view controller.
[6 Marks]
8
CONFIDENTIAL

BCS/BCNI1 1 1211/BCS2303
QUESTION 3

[10 Marks]
HTML is the lingua franca for publishing hypertext on the World Wide Web. Based
on the source code in Figure 4, answer the following questions.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<center>
<h2>Table Example Page<1h2>
<table border = "1' width="500">
<caption>Here is a small sample table<Icaption>
<thead>
<tr><th coispan = "2">This is the table head</th></tr>
<Ithead>
<tfoot>
<tr>
<th>This is the table</th>
<th>foot . <Ith>
<Itr>
<It foot>
<tbody>
<tr><td>Column</td><td>Row</td></tr>
<tr><td colspan = "2">This is the body</td></tr>
</tbody>
</table>
</center>
</body>
</html>
Figure 4
(a) Trace the output of the HTML codes given in Figure 4.
[5 Marks]
(b) Write the code to change the default style of table border into dotted and border
color into light green, as given in Figure 4
[2 Marks]
(c) Write the code to change the <tbody> ... </tbody> and draw the corresponding
output to show on how to use rowspan.
[3 Marks]
CONFIDENTIAL
BCSIBCNI1 1 1211/BCS2303
QUESTION 4
[10 Marks]
JavaScript is a scripting language which is used to enhance the functionality and
appearance of web pages. Based on the source code in Figure 5, answer the following
questions.
<!DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<title>Switching between HTML5 List Formats</title>
<script>
var choice; II user's choice
var startTag; II starting list item tag
var endTag; II ending list item tag
var validlnput = true; /1true if input valid else false
var iistType; IItype of list as a string
choice = window.prompt( "Select a list style:\n" +
"1 (Unordered), 2 (Ordered)", "1" );
switch ( choice
case "1":
startTag =
endTag = "</ul>";
listType = "<hl>Unordered List</hl>";
break;
case "2":
startTag =
endTag = "</01>";
listType = "<hl>Ordered List</hl>";
break;
default:
validlnput = false;
break;
//end switch
if ( validlnput === true
document.writeln( listType + startTag );
for ( var i = 1; i <= 3; ++i
document.writeln( "<li>List item " ++
1 1
</1>" );
document.writeln( endTag );
//end if
else
document.writeln( "Invalid choice: " + choice );
</script>
</head><body></body>
</html>
Figure 5
1 0
CONFIDENTIAL

BCS/BCN/111211/BCS2303
(a) Trace the output of the source code when user enters the choice value as "1" as
shown in Figure 6.
J
J a v a S c r i p t
S el ec t a l i st st yl e:
1 (Unor der ed), 2 (Or der ed)

1oK
[
Ca nc el
J
Figure 6
[3 marks]
(b) Trace the output of the source code when user enters the choice value as "12" as
shown in Figure 7.
1 J a v a S c r i p t L J
S el ec t a l i st st yl e:
1 (Unor der ed), 2 (Or der ed)
[
OK Ca nc el
Figure 7
[3 marks]
(c) Write the code to change the default style of unordered and ordered list into
square bullet and letter list, respectively, as highlighted in Figure 5 .
[4 marks]
11
CONFIDENTIAL

BCS/BCN/1 11211/BC S2303

QUESTION 5

[12 Marks]
PHP, or PHP: Hypertext Preprocessor, has become the most popular server-side
scripting language for creating dynamic web pages. It is an independent platform and
also supports many databases, including MySQL.
(a) In PHP, casting and settype have been used for conversion between types.
Explain the MOST significant difference between these two conversions.
[2 marks]
(b) Assume that PHP variable $firstString = "Hello"; and $secondstring
= "World";. Write a code to combine both variables into $resultString with
the value "Hello World".
[2 marks]
(c) Trace the output of the PHP codes given in Figure 8.
<?php
$first word = 'Internet' . " " . "Programming";
$second word = "How to Program?";
$namel = '$first word $second word';
$name2 = "$first word $second word";
print "<p>l.<br/> namel is $namel <br/> name2 is $name2</p>";
print '<p>2.<br/> namel is $namel <br/> name2 is $name2</p>';
?>
Figure 8
[4 marks]
12
CONFIDENTIAL

BCS/BCN/11 1211/BCS2303
(d) Figure 9 shows the associative array $ record in PHP. Write a PHP statement
that creates 2 normal arrays (using numerical index) named 'month' and
'number'. Elements of array 'month' are the same as the keys of hash array
'record' and elements of array 'number' are the same as the values of the hash
array.
$record = array(
"January" => "first", "February" => "second",
"March" => "third", "April" => "fourth",
"May" => "fifth", "June" => "sixth",
"July" => "seventh", "August" => "eighth",
"September" => "ninth", "October" => "tenth",
"November" > "eleventh", "December" => "twelfth"
) ;
Figure 9
[4 Marks]
1 3
CONFIDENTIAL

BCSIBCN/1112111BCS2303
SECTION C

[30 MARKS]
QUESTION 6

[15 Marks]
You are given an HTML output as shown in Figure 10. It is a combination of HTML
form and table. Write a complete HTML code to produce the same output as shown in
Figure 10.
[15 Marks]
Feedback Form
Please fillout this form to help us improve our site
conmients.
113- mad Address:
D[iiiIIiII__J
Enter coeentsher
' jThings you Ilk- ed: kite design [I) Links Li Ease of use 0 Images LI Source code Li
I
Howdyou get toose?: JiSthengine 4 Lit- Acs fromanothersite 1Deiteicoxn Web site1.Reference inabook C llthei 0
Rate our site
1
n Goo,
____
Submit
Poor
Figure 10
QUESTION 7

[15 Marks]
Based on Figure 10, assume that this form will submit to a PUP file named
'register. php'. After personal information is manually filled in the form, and the
button 'Submit' is clicked, the output of 'register. php' will be displayed as
shown in Figure 11. Figure 12 shows MYSQL database named 'my_db' to be used
with the table named 'survey'. Write a complete PHP script based on Figure 10 and
Figure 11. The script must display the information in Figure 11 and the information is
saved in 'survey' table.
[15 Marks]
14
CONFIDENTIAL

BCS/BCN/l 1 12111BCS2303
You have successfully typed-in these following information:-
Name Selamat Jawab
Comments: This is a fantastic website.
Email: selamat@examplecom
Things you liked: Site design, Links
How did you get to our site?: Search engine
Rate our site: Very Good
Figure 11
survey
Field Type Null Default Comments MIME
name varchar(50) No
comments text No
email varchar(50) No
favourite varchar(50) No
resource varchar(50) No
rating varciiar(50) No
Figure 12
END OF QUESTION PAPER
15