P h i l
advertisement
Philadelphia University
Faculty of Information Technology
Department of Software Engineering
Examination Key
Lecturer: Dr. Samer Hanna
Internal Examiner: Dr. Moayad Al-Adami
Coordinator: Dr. Samer Hanna
Software Engineering of Web Systems
Final Exam’s Key
(0721422 ) Section 1
Second Semester of 2014/2015
th
Date: Monday, June 15 , 2015-------- Time: 2 hours
Q1) (6 marks)
Discuss the following in details:
1. The Hyper Text Transfer Protocol (HTTP), what it is? And why it is used? (2 marks)
Short for HyperText Transfer Protocol, HTTP is the underlying protocol used by the World Wide Web.
HTTP defines how messages are formatted and transmitted, and what actions Web
servers and browsers should take in response to various commands. For example, when you enter a URL in
your browser, this actually sends an HTTP command to the Web server directing it to fetch and transmit the
requested Web page.
2. The Model View Controller (MVC), how it is related to Web development and what are its advantages
over Web forms. (2 marks)
Abbreviated as MVC, Model-View-Controller is the term used to describe a software paradigm that separates
objects into one of three categories:
models for maintaining data
views for displaying all or a portion of the data
controllers for handling events that affect the model or views.
In this separation, the view and controller depend on the model. However, the model does not depend on
either of the two making it so the model can be built and tested independent of the visual presentation.
3. Uses of Extensible Markup Language (XML) with example. (2 marks)
Extensible Markup Language (XML) is a simple, very flexible text format derived from SGML. Originally
designed to meet the challenges of large-scale electronic publishing, XML is also playing an increasingly
important role in the exchange of a wide variety of data on the Web and elsewhere.
Example:
<breakfast_menu>
<food>
<name>Belgian Waffles</name>
<price>$5.95</price>
<description>
Two of our famous Belgian Waffles with plenty of real maple syrup
</description>
<calories>650</calories>
</food>
<food>
<name>Strawberry Belgian Waffles</name>
<price>$7.95</price>
<description>
Light Belgian waffles covered with strawberries and whipped cream
</description>
<calories>900</calories>
</food>
</breakfast_menu>
1
Q2) (8 marks)
Suppose that you work as a Web developer at Philadelphia University and that you are asked to create a Web
page to map the following design.
Figure 1
This Web page allow an academic staff at Philadelphia to insert his/her: name, id, department and phone number and
then press OK to enable this information to be stored in a database.
The Web page should have a column to the right (see Figure) that contains links to some Jordanian Universities.
1. Write the needed HTML to map the above requirement and design. (4 marks)
2. Write the needed CSS code. (2 marks)
3. Add the required asp.net validation to make sure that the academic staff id is between 1 and 2000. (2 marks)
Olution:
1.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Q2.aspx.cs" Inherits="Q2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Philadelphia phone Numbers</title>
</head>
<body>
<form id="form1" runat="server">
<div id="wrapper">
<header>
<h3 class="auto-style1">Philadelphia University<br />Academic Staff Information</h3>
</header>
<div id="content">
<strong>Staff Name: </strong> <br />
<asp:TextBox ID="txtName" runat="server" Width="382px"></asp:TextBox>
<br />
<strong>Staff Id:</strong>
<br />
<asp:TextBox ID="txtId" runat="server" Width="107px"></asp:TextBox>
<br />
<strong>Department:</strong>
2
<br />
<asp:DropDownList ID="ddlDept" runat="server">
<asp:ListItem Value="-1">Choose Faculty</asp:ListItem>
<asp:ListItem Value="1">IT</asp:ListItem>
<asp:ListItem Value="2">Engineering</asp:ListItem>
<asp:ListItem Value="3">Pharmacy</asp:ListItem>
<asp:ListItem Value="4">Low</asp:ListItem>
<asp:ListItem></asp:ListItem>
</asp:DropDownList>
<br />
<strong>Phone Number:
</strong>
<br />
<asp:TextBox ID="txtPhone" runat="server" Width="102px"></asp:TextBox>
<br />
<br />
<asp:Button ID="btnOk" runat="server" Text="OK" style="font-weight: 700" Width="67px" />
<br />
<br />
<br />
<br />
</div>
<aside>
<h3 class="auto-style1"><االردنية الجامعات روابط/h3>
<ul>
<li class="auto-style2"><a href="http://www.just.edu.jo/" target="_blank">جامعة
<والتكنولوجيا العلوم/a></li>
<li class="auto-style2"><a href="http://www.bau.edu.jo/" target="_blank">البلقاء
<التطبيقية/a></li>
<li class="auto-style2"><a href="http://hu.edu.jo/" target="_blank" class="autostyle4"><الهاشــــمية/a></li>
</ul>
</aside>
<footer class="auto-style1">
Copyright &copy Philadelphia University 2015.
</footer>
</div>
</form>
</body>
</html>
2.
<style type="text/css">
body {
margin:0;
}
#wrapper
{
background-color: lightgray;
width: 600px;
margin: auto;
}
#content
{
width: 450px;
float: left;
}
aside
3
{
border-left: 2px solid blue;
border-right: 2px solid blue;
border-top: 2px solid blue;
border-bottom: 2px solid blue;
float: right;
width:133px;
height: 262px;
}
header
{
padding: 0px;
width:600px;
height: 85px;
background-repeat: no-repeat;
}
.auto-style1
{
text-align: center;
float:none;
}
.auto-style2
{
text-align: left;
}
</style>
3.
<asp:RangeValidator ID="RangeValidator1" runat="server" ErrorMessage="invalid id"
ControlToValidate="txtId" MinimumValue="1" MaximumValue="2000"
Type="Integer"></asp:RangeValidator>
Q3) (6 marks)
For the same Web page in Question 2 (Figure 1); accomplish the following:
1. Create an SQL server database (call it DoctorsDB). (1 mark)
Go to SQL Object Explorer right click on SQL Server Add SQL Server write (localdb)\v11.0 OK
right click on Databases Add New Database insert Database Name (DoctorsDB).
2. Create a table (call it Doctors) that have all the information in Figure 1. (1 mark)
Write click on Tables Add New Table insert the following
CREATE TABLE [dbo].[Doctors]
(
[DoctorId] INT NOT NULL PRIMARY KEY,
[DoctorName] NVARCHAR(50) NOT NULL,
[Department] NVARCHAR(50) NULL,
[Phone] NUMERIC NULL
)
3. Create a GridView (call it GridView1) that is filled with all the information in the Doctors table with the help of
Visual Studio to make the connection. (2 marks)
Drag a GridView from toolbox to the form Go to design view Click on the DataGridView arrow select
Add project Data Sourse <New Data Source> SQL Database Specify an id for the data source OK
New Connection Server Name (localdb)\v11.0 Select or enter a database Name CoursesDB
4
OK Next Tick Do you want to save the connection in the application configuration file Choose a name
for the connection string (or leave it as it is CoursesDBConnectionString) Next Next Finish
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="DoctorId"
DataSourceID="SqlDataSource1">
<Columns>
<asp:BoundField DataField="DoctorId" HeaderText="DoctorId" ReadOnly="True"
SortExpression="DoctorId" />
<asp:BoundField DataField="DoctorName" HeaderText="DoctorName"
SortExpression="DoctorName" />
<asp:BoundField DataField="Department" HeaderText="Department"
SortExpression="Department" />
<asp:BoundField DataField="Phone" HeaderText="Phone" SortExpression="Phone" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$
ConnectionStrings:DoctorsConnectionString %>" SelectCommand="SELECT * FROM
[Doctors]"></asp:SqlDataSource>
4. Create another GridView (call it GridView2) that is filled with the Doctors table information using ADO.NET. (2
marks)
string connectionString =
WebConfigurationManager.ConnectionStrings["DoctorsConnectionString"].ConnectionString;
string selectSQL = "SELECT* FROM Accounts";
SqlConnection con = new SqlConnection(connectionString);
SqlCommand cmd = new SqlCommand(selectSQL, con);
SqlDataAdapter adapter = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
adapter.Fill(ds, "Accounts");
GridView2.DataSource = ds;
GridView2.DataBind();
Q4) (6 marks)
Write the needed activities and code to map the design in question 2 using Model View Controller (MVC).
Write the code of the controller, model and also the view.
Controller
namespace Q4.Controllers
{
public class HomeController : Controller
{
//
// GET: /Home/
public ActionResult Index()
{
Doctor d1 = new Doctor()
{
Name = "Samer Hanna",
Id = 618,
Dept = "SE",
Phone = "0795771406"
};
return View(d1);
}
}
}
5
Model
namespace Q4.Models
{
public class Doctor
{
public string Name { get; set; }
public int Id { get; set; }
public string Dept { get; set; }
public string Phone { get; set; }
}
}
View
@model Q4.Models.Doctor
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
<table border="1">
<tr>
<th>Doctor Name</th>
<td>@Model.Name</td>
</tr>
<tr>
<th>Doctor Id</th>
<td>@Model.Id</td>
</tr>
<tr>
<th>Department</th>
<td>@Model.Dept</td>
</tr>
<tr>
<th>Phone</th>
<td>@Model.Phone</td>
</tr>
</table>
</div>
</body>
</html>
Q5) (8 marks)
Write the JavaScript code to map the following requirement related to the Web page in Question2 (Figure 1):
1. Declare an object about certain information inserted in Figure 1. The object should
also contain a function to print the object’s information. (2 mark)
var doctor = {
id: 600,
name: "Samer",
department: "SE",
phone: "0795771406",
display: function () {
alert("Name is : " + doctor.name + "
}
};
6
id is : " + doctor.id);
2. Declare an array that contains the object in branch 1 and an integer that represent
the number of experience years. (1 mark)
var info = [doctor, 7];
3. Display the academic staff name of in an alert box together with a proper welcome.
(1 mark)
var name = document.getElementById("txtName");
alert('Welcome to the web site ' + name.value);
4. Change the color of the right column to red. (1 mark)
var side = document.getElementById('col');
side.style.backgroundColor = "red";
5. Store the academic staff id in the application cookie. (1 mark)
var id = document.getElementById("txtId");
document.cookie = id.value;
6. Validation to make sure that the academic staff id is between 1 and 2000. (2 mark)
function validate() {
var id = document.getElementById("txtId");
if ((id.value < 0) || (id.value > 2000))
alert("Invalid id " + id.value);
}
Q6) (6 marks)
Write the PHP code to map the following requirement related to the Web page in Question2:
7
1.
Declare a class (called Doctor) with same information in Figure 1. The class should also contain also: get and set
functions for the id property and a constructor. (3 marks)
2.
Declare another class called User that has only two properties {user name and password}. (1 marks)
class User
{
public $name, $password;
}
3.
Change the code of the Doctor class to make it inherit from the User class in 2. (2 marks)
8
9
