Post on 22-Jan-2017
DEPARTMENT OF ELECTRICAL AND INFORMATION ENGINEERING
FACULTY OF ENGINEERING
UNIVERSITY OF RUHUNA
INDUSTRIAL TRAINING REPORT SUBMITTED IN PARTIAL FULFILMENT OF
THE DEGREE OF BACHELOR OF SCIENCE IN ENGINEERING
MOBITEL (PVT) LTD
COLOMBO 02, SRI LANKA
(26.01.2015 to 24.04.2014)
THILAKARATHNA A.K.D.D. (EG/2012/2097)
Acknowledgement
I would like to thank all who helped me in successfully completing my first
industrial training of 12 weeks at Mobitel (pvt) Ltd. If I start with my university, I must
thank dean of the faculty, head of electrical and information engineering department and
all the lecturers for guiding me. Also I must thank our training coordinator, staff of
Engineering Education Center of the faculty and staff of NAITA for preparing necessary
requirements and giving me the opportunity to have a good training experience.
I express my gratitude to all the people from Mobitel (pvt) Ltd. Specially I must
mention General Manager of Mobitel, staff from VAS division, our training coordinates
at Mobitel engineering division, all the engineers, technical officers and other Mobitel
staff who spent their most valuable time for providing me a good and effective industrial
training whilst their busy schedules.
Also I have to thank my family and friends who supported me in numerous ways
throughout the time. I apologize for anyone I missed in mentioning here who helped me,
encouraged me and guided me throughout the period of 12 weeks in industrial training
for making it a success and I pay my sincere thanks to them nonetheless.
Thilakarathna A.K.D.D.
Department of Electrical and Information Engineering
Faculty of Engineering
University of Ruhuna
i
Preface
This report is prepared for the completion of 1st industrial training for the electrical and
information engineering degree program. I had 12 weeks of training at Sri Lanka Telecom
Mobitel engineering division. This report consists of four main chapters.
The first chapter of this report gives a brief introduction to Mobitel (Pvt) Ltd. Its history,
organization structure, present performance and achievements are described in the first
chapter, Introduction.
Second chapter describes the technical training experience I had from the company. The
chapter is included by two parts according to the way that I had making the projects using
different software languages. Technical and theoretical information related my division
is further described under sub headings.
Third chapter is about the training experience on management side. The culture within
the office and work premises, different practices followed, safety precautions taken and
how Mobitel works to motivate its staff are mentioned in this chapter.
Fourth chapter summarizes the training experience I had for the period of 12 weeks at
Mobitel engineering division. Also it contains my conclusion on the training program
organized by the university and NAITA, and how Mobitel (pvt) Ltd. conducted the
training program.
Thilakarathna A.K.D.D.
Department of Electrical and Information Engineering
Faculty of Engineering
University of Ruhuna
ii
Content
Content .......................................................................................................................................... ii
List of tables ............................................................................................................................... v
List of figures .............................................................................................................................. v
1.0 Introduction to Mobitel (Pvt) Ltd ...................................................................................... 1
1.1 Introduction .................................................................................................................. 1
1.2 History of Mobitel (Pvt) Ltd ........................................................................................... 2
1.3 Vision and Mission of Mobitel ...................................................................................... 3
1.4 Present performance .................................................................................................... 4
1.5 Organization Structure of Mobitel ................................................................................ 7
2.0 Training Experiences (Technical) at Mobitel ..................................................................... 8
2.1 Database Programing .................................................................................................... 8
2.1.1 RDBMS Terminology .................................................................................................. 8
2.1.2 MySQL Database & PHP ........................................................................................... 9
2.1.2.1 Running & shutting down MySQL Sever ................................................................. 10
2.1.2.2 Setting Up a MySQL User Account .......................................................................... 11
2.1.2.3 Administrative MySQL Command ....................................................................... 12
2.1.2.4 MySQL Connection Using PHP Script .............................................................. 12
2.1.2.5 Example 1: ....................................................................................................... 13
2.1.2.6 Selecting MySQL Database Using PHP Script .................................................. 13
2.1.2.7 Example 2: ....................................................................................................... 14
2.1.2.8 Creating Table from Command Prompt ............................................................... 14
2.1.2.9 Creating Tables Using PHP Script ...................................................................... 15
2.1.2.10 Example 3: ......................................................................................................... 15
2.1.2.11 Inserting Data from Command Prompt ............................................................ 16
2.1.2.12 Inserting Data Using PHP Script ........................................................................ 17
2.1.2.13 Example 4: ......................................................................................................... 17
2.1.2.14 Updating Data from Command Prompt ................................................................ 18
2.1.2.15 Updating Data Using PHP Script ........................................................................ 18
2.1.2.16 Example 5: ......................................................................................................... 18
2.1.2.17 Deleting Data from Command Prompt ............................................................. 19
2.1.2.18 Deleting Data Using PHP Script ............................................................................. 20
2.1.2.19 Example 6: ......................................................................................................... 20
2.1.2.20 Using ORDER BY clause Command Prompt ................................................... 20
iii
2.1.2.21 Using ORDER BY clause inside PHP Script ..................................................... 21
2.1.2.22 Example 7: ......................................................................................................... 21
2.2 Xampp Server ........................................................................................................ 23
2.2.1 Run PHP Program in Xampp Server............................................................................ 23
2.2.1.1 Step 1 .............................................................................................................. 24
2.2.1.2 Step 2 .............................................................................................................. 24
2.2.1.3 Step 3 .............................................................................................................. 25
2.2.1.4 Step 4 .............................................................................................................. 25
2.2.1.5 Step 5 .............................................................................................................. 26
2.2.1.6 Step 6 .............................................................................................................. 26
2.3 Java with Primefaces ............................................................................................. 27
2.3.1 Primefaces JSF Component Main Features ........................................................ 27
2.3.2 Primefaces DataTable ........................................................................................ 28
2.3.3 Getting stared with the DataTable ..................................................................... 29
2.3.4 Header and Footer in DataTable ........................................................................ 30
2.3.5 Pagination in DataTable ..................................................................................... 31
2.3.6 Sorting in DataTable ........................................................................................... 31
2.3.7 Data Filtering in DataTable ................................................................................. 32
2.3.8 Row Selection in DataTable ............................................................................... 34
2.3.9 Incell Editing in DataTable .................................................................................. 35
2.3.10 Cell Selection in Datatable ............................................................................... 36
2.4 JQuery ................................................................................................................... 38
2.4.1 Execute JQuery ................................................................................................... 38
2.4.2 Features Support by JQuery ............................................................................... 39
2.4.3 DOM Manipulation ............................................................................................ 40
2.4.4 Example 8 ........................................................................................................... 40
2.4.5 Events Handling .................................................................................................. 41
2.4.6 Binding Event Handling ...................................................................................... 41
2.4.7 Ajax ..................................................................................................................... 42
2.4.8 Getting JSON Data .............................................................................................. 43
2.4.9 Example 9 ......................................................................................................... 43
2.5 CSS Technique ..................................................................................................... 45
2.5.1 Execute CSS ........................................................................................................ 45
2.5.2 CSS Selectors ...................................................................................................... 46
2.5.2.1 Type Selectors ................................................................................................. 46
2.5.2.2 Universal Selectors .......................................................................................... 46
iv
2.5.2.3 Class Selectors ................................................................................................. 46
2.5.2.4 ID Selectors ..................................................................................................... 47
2.5.3 Setting Backgrounds Using CSS .......................................................................... 47
2.5.3.1 Set the Background image .............................................................................. 47
2.5.3.2 Set the Background image position ................................................................ 48
2.5.3.1 Set the font Size .............................................................................................. 48
2.5.4 Set the Table ...................................................................................................... 48
3.0 Training Experiences (Management) at Mobitel ............................................................ 50
3.1 Administrative and Office Practice ............................................................................. 50
3.2 Measures to motivate staff ......................................................................................... 51
4.0 Summary and Conclusions .............................................................................................. 52
4.1 Summary of the 12 weeks training at Mobitel ........................................................... 52
4.2 Conclusion ................................................................................................................... 52
References .................................................................................................................................. 54
v
List of tables
2.1 INFORMATION ON DATATABLE OF PRIMEFACE 29
List of figures
1.1 LOGO OF MOBITEL (PVT) LTD 1
1.2 ORGANIZATION STRUCTURE OF MOBITEL (PVT) LTD. 9
2.1 MYSQL LOGO 11
2.2 XAMPP SERVER LOGO 12
2.3 XAMPP SERVER CONTROL PANEL 13
2.4 XAMPP SERVER WELCOME PAGE 15
2.5 FIRST.PHP PAGE 18
2.6 PRIMEFACE LOGO 19
2.7 WEB INTERFACES OF PRIMEFACES 23
2.8 PRIMEFACES DATATABLE 25
2.9 DATATABLE WITH HEADER & FOOTER 26
2.10 COLUMN FILTER DATATABLE 26
2.11 CELL EDIT DATATABLE 26
2.12 JQUERY LOGO 26
2.13 CSS LOGO 26
1
Chapter 1
1.0 Introduction to Mobitel (Pvt) Ltd
1.1 Introduction
Mobitel Private Ltd, is a fully-owned subsidiary of Sri Lanka Telecom. Mobitel offers
mobile telephony services, high-speed broadband, Enterprise Solutions, IDD services and
a lot of Value Added Services. Mobitel has a strong customer base of nearly 5 million
subscribed Mobitel services offered both prepaid and postpaid. And Mobitel owns nearly
2000 Base Stations Island wide to serve its customers. Mobitel was the first in South Asia
to launch a Super 3.5G network, to successfully demonstrate HSPA + MIMO technology
and successfully trial 4G/ LTE technology. Introduction of Dual Carrier HSPA+
technology and 4G-LTE service capable of providing 100Mbps downlink speed and
50Mpbs uplink speed makes Mobitel’s mobile broadband speeds the fastest in the
country.
With the slogan of “We Care, always” Mobitel provides a customer prioritized service
with wide coverage, superior quality and a better customer service. It has gained customer
attraction by offering variety of packages like ‘Upahara’ late night budget internet, etc.
and value added services like mCash, Channeling services, mTicket which fulfills the
various needs of the customers. Currently it is one of the leading mobile service providers
in Sri Lanka with a substantial market share.
FIGURE 1.1: LOGO OF MOBITEL (PVT) LTD
2
1.2 History of Mobitel (Pvt) Ltd
Mobitel was established on 11th of February 1993 by a collaboration between Sri Lanka
Telecom and Telstra Corporation Limited under a Build Operate and Transfer agreement
between the two parties. It was the second mobile operator to provide telecommunication
services within Sri Lanka. In 1995, a Memorandum of Understanding was signed between
Sri Lanka Telecom and Telstra Corporation Limited regarding the total stake of Mobitel
so 60% of the stake was owned by Telstra Corporation Limited and the remaining 40%
was owned by Sri Lanka Telecom. Mobitel started its operations with AMPS (Advanced
Mobile Phone System) technology and upgraded to DAMPS (Digital Advanced Mobile
Phone System) technology in 1998.
In November 2002, after nearly a decade from the initiation, ownership of Mobitel was
fully transferred to Sri Lanka Telecom. There after a prefix phrase, ‘Sri Lanka Telecom’,
was added to the company name. It started its GSM (Global System for Mobile)
operations in January 2004 being the second GSM service provider in Sri Lanka. With
that Mobitel was capable to provide GPRS (General Packet Radio service) and EDGE
(Enhanced Data rate for Global Evolution) facilities to the subscribers. Mobitel launches
3G with the first international Buddhist conference. Then Mobitel became the first to
launch a 3.5G HSPA (High Speed Packet Access) network in the South Asia providing
internet facilities with a 7.2 Mbps downlink and 2Mbps uplink data speed.
At the beginning Mobitel used TDMA (Time Division Multiple Access) to provide
communication facilities, which is known as the 1st Generation (1G) analog mobile
communication. With the growth of the company TDMA was not sufficient enough to
meet the communication requirement. Also it didn’t support Value Added Services. So
the company took a decision to upgrade its network to GSM which is the 2nd generation
(2G) digital mobile communication. That gave Mobitel to serve more customers with
more services with a higher quality.
Ericsson was the sole vendor of equipment and technology to Mobitel at first. Afterwards
Mobitel moved to Huawei and ZTE equipment and technology. In 2001 Mobitel had only
about 100 thousand subscribers. Being the fastest growing mobile network in Sri Lanka
Mobitel has increased its number of subscribers into 5 million within last decade.
3
1.3 Vision and Mission of Mobitel
Sri Lanka Telecom Mobitel is now in a unique position as the 'National' mobile service
provider of Sri Lanka and has become one of the leading companies in the mobile
communication sector of Sri Lanka. Not only providing wide coverage, good quality of
service Mobitel always concerns highly about its customers. Mobitel’s vision and mission
is towards better satisfaction of their most valuable asset, which is the customer followed
by the success of the company.
Vision:
To lead Sri Lanka towards an info-com and knowledge rich society through our
service offerings
Every employee has a role to play in our vision to lead, helping us to focus our efforts
and remain a truly dynamic and successful organization.
Mission:
To Care, Share & Deliver
These are the 3 key ingredients in our relationship with our Shareholders, Employees, and
Customers. Committing to these 3 principles as an individual and as a team and by
regularly practicing them as an organization, we can truly achieve our vision to lead.
4
1.4 Present performance
Mobitel has coverage all over Sri Lanka with 2G, 3G and newly introduced 4G LTE.
Mobitel has the 2nd largest customer base of about 5 million subscribers in Sri Lankan
mobile telecommunication industry. With innovative strategies, sophisticated technology
and competitive prices Mobitel has been able to attract this much of customers.
Currently Mobitel has offered unique and valuable prepaid and postpaid packages which
suits the all different kind of needs of the customers. It also provide useful services,
broadband packages, value added services, etc. Some of them are,
1. News alerts, which gives instant news updated from popular news stations
through SMS.
2. Ticket booking, people can book train tickets simply using their Mobitel
connection.
3. eChanneling, people can channel their doctors from wherever they are using
Mobitel connection.
4. mLearning, a resourceful package powering up the conventional education
with modern technology.
5. IDD and Roaming facilities, making global calls from within country or
outside the country is simple and cheaper with Mobitel
6. Variety of broadband packages from light packages to corporate packages
with speeds upto 100Mbps with 4G LTE technology.
7. MMS, GPRS, WAP services enabling mobile phone users to interact with
multimedia content.
Mobitel had launched its 2G GSM network in 2004 and after 6 months it upgraded the
network to 2.5G which gives the network capability to provide GPRS and EDGE facilities
to its subscribers. Mobitel was the fastes growing GSM network from then. At the
beginning it only covered major cities and suburbs. Now it has grown into a GSM network
covering more than 95% of Sri Lanka.
5
The most recent introduction of Mobitel is 4G LTE network. Its coverage is being
expanded in these days. Currently Mobitel 4G coverage is given to most of main cities of
the land. Colombo, Kandy, Kalutara, Galle, Matara, Hambantota, Jaffna, Nuwaraeliya,
Negambo, Gampaha are fully covered now and there are more to come real soon.
The greatest strength of the company is the competitive workforce in it, working together
towards the same goal with great dedication. Mobitel has a very talented and skilled set
of people in the country and they recruit the best individuals passing out from universities,
technical colleges fulfilling its vision. Most of them are young people with full of courage
in achieving the goals.
Mobitel, going with its motto, “We Care, Always” has served the community in many
aspects. This motto has made the employees work towards one key objective, caring about
the community, serving them with the very best of their services. Sri Lanka Telecom
Mobitel entered into a partnership with Google to introduce “M3 Apps”. With the launch
of M3 Apps, all Mobitel customers will be entitled to register for a host of new services
that will include a suite of communication and collaborative tools, offering among many
other exciting features, an email address accessible via any network. Not only that
Upahara package for both telephone and broadband, the recent launch of M- cash which
is an instant money transfer method, etc. gives a great service to the customers as in low
charging rates & other facilities. It has multi ethnic personnel working in harmony in a
pleasant environment, as a family. Sri Lanka Telecom, being its owner, is a great strength
for Mobitel.
In the social aspect Mobitel as the National Mobile Services Provider feels strongly about
making society part of their success. Mobitel consider as customer is the most valuable
person in their profession and exchange ideas and undertakings that will endow Sri
Lankan society with the asset of improved opportunities for a future of promise. Already
they have gotten a giant steps to make improvements of the society Here are some recent
activities carried out by Mobitel.
Mobitel recently announced the launch of several new initiatives with the University of
Colombo. These new projects will make the strong relationship with the Universities as
well as benefit University students with the resources and technology. It is a win for all.
The final result of such activities is a future with better ICT knowledge.
6
Also Mobitel has come forward to lend their support to the National Child Protection
Authority. This will involve a number of projects, which will be undertaken by Mobitel,
to help develop and build the National Child Protection Authority’s (NCPA) program and
its work. It gives strength to its vision of creating child-friendly and protective
environments for children. Mobitel signed an agreement with the General Sir John
Kotelawala Defense University (KDU) to facilitate online learning of the university’s
professional studies through the Mobitel mLearning platform, as mentioned before a
breakthrough method of powering up education via advanced technology. They are only
few examples of what Mobitel did for the society and will continue to do them in the
future as well.
Furthermore while doing immense service to its customers and the socity as a whole
Mobitel is being recognized for its performance as well. Here are some recent awards and
recognition won by Mobitel.
Mobitel won Service Brand of the Year Award at SLIM Brand Excellence 2013
as a recognition to its commitment to customers through efforts to create a
knowledge rich society and innovative product and service offerings. The ‘Service
Brand of the Year’ award is judged on overall brand health and brand equity,
brand process in terms of brand strategy and brand performance in overall growth
of market share and revenue.
Mobitel became the proud winner of ‘Taiki Akimoto 5S Award’ and ‘Best 5S
Implementation in the Telecommunications Sector (Large Category) Award’, at
the annual Japan Sri Lanka Technical and Cultural Association (JASTECA)
Awards.
Best Project Award 2013 at National Project Management Excellence (NPME)
Awards 2013
Gold Award for the Best Demonstration at Techno 2013
Liyasara, the mobile package specially introduced for women, Nominated for
Global Mobile Award
7
CEO
Chief Financial Officer
Finance Division
Credit Division
Engineering and Implimentation
Engineering
Network Performance Assuarance
BSS
Radio Access Network
Regional Operations
Power
Regional Managers
Field Operations
Transmission
Civil
IN and VAS Core Network
CS Core Network
PS Core Network
ITU
INOC
Implimentation Service Quality
Chief Marketing Officer
Marketing Division
Customer Care
Chief Administrative
Officer
HR Division
Administrative Division
1.5 Organization Structure of Mobitel
FIGURE 1.2: ORGANIZATION STRUCTURE OF MOBITEL (PVT) LTD
8
Chapter 2
2.0 Training Experiences (Technical) at Mobitel
During the 12 weeks of training period I was assigned to VAS & OSS division of Mobitel
Engineering Division. During these periods I had really good experience on the software
field with the help of the engineers and technical officers at Mobitel. They were really
friendly and never hesitated to teach us what they knew. They let us use the manuals and
other resources which were given for their use. Even there were some presentations held
for the trainees on technical matters.
I was given the opportunity to take part in field visits as well. During these visits I had
hands on experience with creating required connections, configuration of the devices,
using the tools like crimpers, power analyzers etc. For all of these visits we were given
transportation facilities by Mobitel.
2.1 Database Programing
A database is a separate application that stores a collection of data. Each database has
one or more distinct APIs for creating, accessing, managing, searching and replicating
the data it holds.
Other kinds of data stores can be used, such as files on the file system or large hash tables
in memory but data fetching and writing would not be so fast and easy with those types
of systems.
So nowadays, we use relational database management systems (RDBMS) to store and
manage huge volume of data. This is called relational database because all the data is
stored into different tables and relations are established using primary keys or other keys
known as foreign keys.
2.1.1 RDBMS Terminology
Before we proceed to explain databases system, let's revise few definitions related to
database.
9
Database: A database is a collection of tables, with related data.
Table: A table is a matrix with data. A table in a database looks like a simple
spreadsheet.
Column: One column (data element) contains data of one and the same kind, for
example the column postcode.
Row: A row ( tuple, entry or record) is a group of related data, for example the
data of one subscription.
Redundancy: Storing data twice, redundantly to make the system faster.
Primary Key: A primary key is unique. A key value can not occur twice in one
table. With a key, we can identify rows where we want to access.
Foreign Key: A foreign key is the linking pin between two tables. This key is
used in multiple tables there we want to connect each other.
Compound Key: A compound key (composite key) is a key that consists of
multiple columns, because one column is not sufficiently unique.
Index: An index in a database resembles an index at the back of a book.
Referential Integrity: Referential Integrity makes sure that a foreign key value
always points to an existing row.
2.1.2 MySQL Database & PHP
FIGURE 2.1: MYSQL LOGO
10
MySQL is a fast, easy-to-use RDBMS being used for many small and big businesses.
MySQL is developed, marketed, and supported by MySQL AB, which is a Swedish
company. MySQL is becoming so popular because of many good reasons.
MySQL is released under an open-source license. Therefor we won’t to pay for
that to operate the system. .
MySQL is a very powerful program in its own right. It handles a large subset of
the functionality of the most expensive and powerful database packages.
MySQL uses a standard form of the well-known SQL data language.
MySQL works on many operating systems and with many languages including
PHP, PERL, C, C++, JAVA, etc.
MySQL works very quickly and works well even with large data sets. The
accuracy of the data processing is very high.
MySQL is very friendly to PHP, the most appreciated language for web
development.
MySQL supports large databases, up to 50 million rows or more in a table. The
default file size limit for a table is 4GB, but we can increase this to a theoretical
limit of 8 million terabytes (TB).
MySQL is customizable. The open-source GPL license allows programmers to
modify the MySQL software to fit their own specific environments.
2.1.2.1 Running & shutting down MySQL Sever
First we should check MySQL server is running or not. We can use the following
command:
ps -ef | grep mysqld
If our MySql is running, then we will see mysqld process listed out in our result. If server
is not running, then we can start it by using the following command:
11
root@host# cd /usr/bin
./safe_mysqld &
Now, if we want to shut down an already running MySQL server, then we can do it by
using the following command:
root@host# cd /usr/bin
./mysqladmin -u root -p shutdown
Enter password: ******
2.1.2.2 Setting Up a MySQL User Account
For adding a new user to MySQL, we just need to add a new entry to user table in
database mysql.
Below is an example of adding new user member with SELECT, INSERT and
UPDATE privileges with the password member1;
root@host# mysql -u root -p
Enter password:*******
mysql> use mysql;
Database changed
mysql> INSERT INTO user
(host, user, password,)
VALUES ('localhost', 'member',
PASSWORD('member1');
Query OK,
mysql> FLUSH PRIVILEGES;
12
Query OK,
mysql> SELECT host, user, password FROM user WHERE user = 'member';
The above MySQL code is related with the changing our database when we want to reset
to some kind of security purposes.
2.1.2.3 Administrative MySQL Command
Here is the list of important MySQL commands, which we will use time to time to work
with MySQL database:
USE user: This will be used to select a user database in MySQL workarea.
SHOW DATABASES: Lists the databases that are accessible by the MySQL
DBMS.
SHOW TABLES: Shows the tables in the database once a database has been
selected with the use command.
SHOW COLUMNS FROM member : Shows the attributes, types of attributes,
key information, whether NULL is permitted, defaults, and other information for
a member table.
SHOW INDEX FROM member : Presents the details of all indexes on the
member table, including the PRIMARY KEY.
SHOW TABLE STATUS LIKE member\G: Reports details of the MySQL
DBMS performance and statistics.
2.1.2.4 MySQL Connection Using PHP Script
PHP provides mysql_connect() function to open a database connection. This function
takes five parameters and returns a MySQL link identifier on success or FALSE on
failure.
$connection = mysql_connect(server,user,passwd);
13
We can disconnect from MySQL database anytime using another PHP function
mysql_close(). This function takes a single parameter, which is a connection returned by
mysql_connect() function.
bool mysql_close ( resource $connection);
2.1.2.5 Example 1:
<html>
<head>
<title>Connecting MySQL Server</title>
</head>
<body>
<?php
$dbhost = 'localhost';
$dbuser = 'member';
$dbpass = 'member1';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
die('Could not connect: ' . mysql_error());
}
echo 'Connected successfully';
mysql_close($conn);
?>
</body>
</html>
2.1.2.6 Selecting MySQL Database Using PHP Script
PHP provides function mysql_select_db to select a database. It returns TRUE on success
or FALSE on failure.
14
bool mysql_select_db( db_name, connection );
2.1.2.7 Example 2:
Here is the example showing you how to select a database.
<html>
<head>
<title>Selecting MySQL Database</title>
</head>
<body>
<?php
$dbhost = 'localhost';
$dbuser = 'member';
$dbpass = 'member1';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
die('Could not connect: ' . mysql_error());
}
echo 'Connected successfully';
mysql_select_db( 'USER' );
mysql_close($conn);
?>
</body>
</html>
2.1.2.8 Creating Table from Command Prompt
This is easy to create a MySQL table from mysql> prompt. You will use SQL command
CREATE TABLE to create a table.
root@host# mysql -u root -p
Enter password:*******
15
mysql> use USER;
Database changed
mysql> CREATE TABLE user(
-> user_id INT NOT NULL AUTO_INCREMENT,
-> user_title VARCHAR(100) NOT NULL,
-> user_author VARCHAR(40) NOT NULL,
-> submission_date DATE,
-> PRIMARY KEY ( user_id )
-> );
Query OK,
mysql>
2.1.2.9 Creating Tables Using PHP Script
To create new table in any existing database you would need to use PHP function
mysql_query(). You will pass its second argument with proper SQL command to create
a table.
2.1.2.10 Example 3:
<html>
<head>
<title>Creating MySQL Tables</title>
</head>
<body>
<?php
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = 'root';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
die('Could not connect: ' . mysql_error());
}
echo 'Connected successfully<br />';
16
$sql = "CREATE TABLE user_tbl( ".
"user_id INT NOT NULL AUTO_INCREMENT, ".
"user_title VARCHAR(100) NOT NULL, ".
"user_author VARCHAR(40) NOT NULL, ".
"submission_date DATE, ".
"PRIMARY KEY ( user_id )); ";
mysql_select_db( 'USER' );
$retval = mysql_query( $sql, $conn );
if(! $retval )
{
die('Could not create table: ' . mysql_error());
}
echo "Table created successfully\n";
mysql_close($conn);
?>
</body>
</html>
2.1.2.11 Inserting Data from Command Prompt
This will use SQL INSERT INTO command to insert data into MySQL table user_tbl.
The following command will show how to insert into database where table name is
user_tb1.
root@host# mysql -u root -p password;
Enter password:*******
mysql> use USER;
Database changed
mysql> INSERT INTO user_tbl
->(user_title, user_author, submission_date)
->VALUES
->
Query OK,
17
mysql> INSERT INTO user_tbl
->(user_title, user_author, submission_date)
->VALUES
->
Query OK,
mysql> INSERT INTO user_tbl
->(user_title, user_author, submission_date)
->VALUES
->
Query OK,
mysql>
2.1.2.12 Inserting Data Using PHP Script
We can use same SQL INSERT INTO command into PHP function mysql_query() to
insert data into a MySQL table.
2.1.2.13 Example 4:
<?php $servername = "localhost"; $username = "username"; $password = "password"; $dbname = "user";
$conn = new mysqli($servername, $username, $password, $dbname); if ($conn->connect_error) { die("Connection failed: " . $conn->connect_error); } $sql = "INSERT INTO member (firstname, lastname, email) VALUES ('John', 'Doe', 'john@example.com')"; if ($conn->query($sql) === TRUE) {
echo "New record created successfully"; } else {
18
echo "Error: " . $sql . "<br>" . $conn->error; } $conn->close(); ?>
The above example is show how to insert data into user database where table is member
also here show putting some values for firstname , lastname and email.
2.1.2.14 Updating Data from Command Prompt
This will use SQL UPDATE command with WHERE clause to update selected data into
MySQL table user_tbl.
root@host# mysql -u root -p password;
Enter password:*******
mysql> use USER;
Database changed
mysql> UPDATE user_tbl
-> SET user_title='Learning PHP'
-> WHERE user_id=3;
Query OK,
mysql>
2.1.2.15 Updating Data Using PHP Script
You can use SQL UPDATE command with or without WHERE CLAUSE into PHP
function mysql_query(). This function will execute SQL command in similar way it is
executed at mysql> prompt.
2.1.2.16 Example 5:
19
<?php
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = 'root';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
die('Could not connect: ' . mysql_error());
}
$sql = 'UPDATE user_tbl
SET user_title="Learning PHP"
WHERE user_id=3';
mysql_select_db('USER');
$retval = mysql_query( $sql, $conn );
if(! $retval )
{
die('Could not update data: ' . mysql_error());
}
echo "Updated data successfully\n";
mysql_close($conn);
?>
2.1.2.17 Deleting Data from Command Prompt
This will use SQL DELETE command with WHERE clause to delete selected data into
MySQL table user_tbl.
root@host# mysql -u root -p password;
Enter password:*******
mysql> use USER;
Database changed
mysql> DELETE FROM user_tbl WHERE user_id=3;
20
Query OK, 1 row affected (0.23 sec)
mysql>
2.1.2.18 Deleting Data Using PHP Script
You can use SQL DELETE command with or without WHERE CLAUSE into PHP
function mysql_query(). This function will execute SQL command in similar way it is
executed at mysql> prompt.
2.1.2.19 Example 6:
<?php
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = 'root';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
die('Could not connect: ' . mysql_error());
}
$sql = 'DELETE FROM user_tbl
WHERE user_id=3';
mysql_select_db('USER');
$retval = mysql_query( $sql, $conn );
if(! $retval )
{
die('Could not delete data: ' . mysql_error());
}
echo "Deleted data successfully\n";
mysql_close($conn);
?>
2.1.2.20 Using ORDER BY clause Command Prompt
21
This will use SQL SELECT command with ORDER BY clause to fetch data from
MySQL table user_tbl.
root@host# mysql -u root -p password;
Enter password:*******
mysql> use USER;
Database changed
mysql> SELECT * from user_tbl ORDER BY user_author ASC
+-------------+----------------+-----------------+-----------------+
| user_id | user_title | user_author | submission_date |
+-------------+----------------+-----------------+-----------------+
| 2 | Learn MySQL | Abdul S | 2007-05-24 |
| 1 | Learn PHP | John Poul | 2007-05-24 |
| 3 | JAVA Tutorial | Sanjay | 2007-05-06 |
+-------------+----------------+-----------------+-----------------+
mysql>
2.1.2.21 Using ORDER BY clause inside PHP Script
We can use similar syntax of ORDER BY clause into PHP function mysql_query(). This
function is used to execute SQL command and later another PHP function
mysql_fetch_array() can be used to fetch all the selected data.
2.1.2.22 Example 7:
<?php
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = 'root';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
die('Could not connect: ' . mysql_error());
22
}
$sql = 'SELECT user_id, user_title,
user_author, submission_date
FROM user_tbl
ORDER BY user_author DESC';
mysql_select_db(USER);
$retval = mysql_query( $sql, $conn );
if(! $retval )
{
die('Could not get data: ' . mysql_error());
}
while($row = mysql_fetch_array($retval, MYSQL_ASSOC))
{
echo "User ID :{$row['user_id']} <br> ".
"Title: {$row['user_title']} <br> ".
"Author: {$row['user_author']} <br> ".
"Submission Date : {$row['submission_date']} <br> ".
"--------------------------------<br>";
}
echo "Fetched data successfully\n";
mysql_close($conn);
?>
23
2.2 Xampp Server
FIGURE 2.2: XAMPP SERVER LOGO
XAMPP has four primary components. These are:
1. Apache: Apache is the actual web server application that processes and delivers web
content to a computer.
2. MySQL: Every web application, howsoever simple or complicated, requires a
database for storing collected data. MySQL, which is open source, is the world’s most
popular database management system. It powers everything from hobbyist websites to
professional platforms like WordPress.
3. PHP: PHP stands for Hypertext Preprocessor. It is a server-side scripting language
that powers some of the most popular websites in the world, including WordPress and
Facebook. It is open source, relatively easy to learn, and works perfectly with MySQL,
making it a popular choice for web developers.
2.2.1 Run PHP Program in Xampp Server
PHP program can be run under various like WAMP, XAMPP etc.
WAMP Server: this server is a web development platform which helps in
creating dynamic web applications.
XAMPP Server: It is a free open source cross-platform web server package.
24
2.2.1.1 Step 1
Assume you installed Xampp in C Drive. Go to: C:\xampp\htdocs Create folder, name
it as first.
2.2.1.2 Step 2
Now create first php program in Xampp and name it as “first.php”:
<html>
<head><title>First PHP</title></head>
<body>
<?php
print "<h2>php program to add two numbers...</h2><br />";
$val1 = 20; $val2 = 20;
$sum = $val2 + $val2;
echo "Result(SUM): $sum";
?>
</body>
</html>
25
2.2.1.3 Step 3
Now double click on “XAAMP CONTROL PANEL” on desktop and START
“Apache”
FIGURE 2.3 :XAMPP SERVER CONTROL PANEL
2.2.1.4 Step 4
Type localhost on browser and press enter: It will show the following:
FIGURE 2.4: XAMPP SERVER WELCOME PAGE
26
2.2.1.5 Step 5
Now type the following on browser:
http://localhost/first/ Below screenshot shows php files created under folder “first”
2.2.1.6 Step 6
Click on “first.php” and it will show the following:
FIGURE 2.5: FIRST.PHP PAGE
27
2.3 Java with Primefaces
FIGURE 2.6: PRIMEFASES LOGO
PrimeFaces is an open source JSF components suite with various extensions for custom
web applications development and for Mobile web applications development. PrimeFaces
JSF component provide provision to make Rich front end interface on Web and Mobile
applications. It use for developing a rich web application. In here java is the supporting
language to build web application.
2.3.1 Primefaces JSF Component Main Features
Why we use PrimeFaces JSF Components in our Web applications, below are the main
features of PrimeFaces suite which are showing the different facilities to use it for web
applications development.
Primefaces provides Rich set of components like Html Editor, Dialogs, data table,
layout, AutoComplete, Charts and many more.Visitor Location Register (VLR)
Provide Ajax support. Built in Ajax based on standard JSF 2.0 Ajax APIs.
Primefaces is a Lightweight, zero-configuration, one jar file and no required
dependencies.
Primefaces provides Ajax Push support via web sockets.
Skinning Framework with 30 built-in themes and support for visual theme
designer tool.
28
FIGURE 2.7: WEB INTERFACES OF PRIMEFACES
2.3.2 Primefaces DataTable
DataTable is an enhanced version of the standard Datatable that provides built-in
solutions to many commons use cases like paging, sorting, selection, lazy loading,
filtering and more.
FIGURE 2.8: PRIMEFASES DATATABLE
29
Info
Tag : dataTable
Component Class : org.primefaces.component.datatable.DataTable
Component Type : org.primefaces.component.DataTable
Component Family : org.primefaces.component
Renderer Type : org.primefaces.component.DataTableRenderer
Renderer Class : org.primefaces.component.datatable.DataTableRenderer
TABLE 2.1: INFORMATION ON DATATABLE OF PRIMEFACES
2.3.3 Getting stared with the DataTable
Using <p:column> command we can set a column in data table. Then we can insert
value for each column using <h:output> values.
<p:dataTable var="car" value="#{carBean.cars}">
<p:column>
<f:facet name="header">
<h:outputText value="Model" />
</f:facet>
<h:outputText value="#{car.model}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Year" />
</f:facet>
<h:outputText value="#{car.year}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Manufacturer" />
</f:facet>
<h:outputText value="#{car.manufacturer}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Color" />
</f:facet>
<h:outputText value="#{car.color}" />
</p:column>
</p:dataTable>
30
2.3.4 Header and Footer in DataTable
FIGURE 2.9: DATA TABLE WITH HEADER & FOOTER
<p:dataTable var="car" value="#{carBean.cars}"
widgetVar="carsTable">
<f:facet name="header">
List of Cars
</f:facet>
<p:column>
<f:facet name="header">
Model
</f:facet>
#{car.model}
<f:facet name="footer">
8 digit code
</f:facet>
</p:column>
<p:column headerText="Year" footerText="1960-2010">
#{car.year}
</p:column>
//more columns
<f:facet name="header">
In total there are #{fn:length(carBean.cars)} cars.
</f:facet>
</p:dataTable>
31
2.3.5 Pagination in DataTable
2.3.6 Sorting in DataTable
Instead of using the default sorting algorithm which uses a java comparator, we can plug-
in sort method.
<p:dataTable var="car" value="#{carBean.cars}" paginator = "true"
rows="10">
//in between columns
</p:dataTable>
<p:dataTable var="car" value="#{carBean.cars}">
<p:column sortBy="#{car.model}">
<f:facet name="header">
<h:outputText value="Model" />
</f:facet>
<h:outputText value="#{car.model}" />
</p:column>
...more columns
</p:dataTable>
<p:dataTable var="car" value="#{carBean.cars}" dynamic = "true">
<p:column sortBy="#{car.model}"
sortFunction="#{carBean.sortByModel}">
<f:facet name="header">
<h:outputText value="Model" />
</f:facet>
<h:outputText value="#{car.model}" />
</p:column>
...more columns
</p:dataTable>
32
Sorting is specified at column level, defining sortBy attribute enables ajax based sorting
on that particular column.
2.3.7 Data Filtering in DataTable
This will perform to do column wise filter in datatable using “filterby” command there
we want to filter out element. Filter inputs can be styled using filterStyle and
filterStyleClass attributes. If we’d like to use a dropdown instead of an inputtext to only
allow predefined filter values use filterOptions attribute and a collection/array of
selectitems as value. Following is an advanced filtering datatable with these options
demonstrated. In there we have created more column and their will filter column wise
each column can filter by separately.
public int sortByModel(Car car1, Car car2) {
// return -1,0,1 if car1 is less than, equal to or
greater than car2
}
<p:dataTable var="car" value="#{carBean.cars}">
<p:column filterBy="#{car.model}">
<f:facet name="header">
<h:outputText value="Model" />
</f:facet>
<h:outputText value="#{car.model}" />
</p:column>
...more columns
</p:dataTable>
33
Following image will show how to display above Datatable in interface. There we can
see number of column filters is performed under each column.
<p:dataTable var="car" value="#{carBean.cars}" widgetVar
="carsTable">
<f:facet name="header">
<p:outputPanel>
<h:outputText value="Search all fields:" />
<h:inputText id="globalFilter" onkeyup="carsTable.filter()" />
</p:outputPanel>
</f:facet>
<p:column filterBy="#{car.model}" headerText="Model"
filterMatchMode ="contains">
<h:outputText value="#{car.model}" />
</p:column>
<p:column filterBy="#{car.year}" headerText="Year" footerText
="startsWith">
<h:outputText value="#{car.year}" />
</p:column>
<p:column filterBy="#{car.manufacturer}" headerText="Manufacturer"
filterOptions="#{carBean.manufacturerOptions}" filterMatchMode
="exact">
<h:outputText value="#{car.manufacturer}" />
</p:column>
<p:column filterBy="#{car.color}" headerText="Color"
filterMatchMode ="endsWith">
<h:outputText value="#{car.color}" />
</p:column>
</p:dataTable>
34
FIGURE 2.10: COLUMN FILTER DATATABLE
2.3.8 Row Selection in DataTable
There are several ways to select row(s) from datatable. Let’s begin for single selection to
the BusBean to hold the selected data. Also we can perform multiple selection by
increasing following code.
public class BusBean {
private List<Bus> buses;
private Car selectedBus;
private Car[] selectedBuses;
public BusBean() {
buses = new ArrayList<Bus>();
cars.add(new Bus("Bus123",2005,"TaTa","blue"));
//we bus add more
}
//getters and setters
}
35
2.3.9 Incell Editing in DataTable
Incell editing provides an easy way to display editable data. “p:cellEditor” is used to
define the cell editor of a particular column and “p:rowEditor” is used to toggle edit/view
displays of a row.
<p:dataTable var="car" value="#{carBean.cars}">
<f:facet name="header">
In-Cell Editing
</f:facet>
<p:column headerText="Model">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{car.model}" />
</f:facet>
<f:facet name="input">
<h:inputText value="#{car.model}"/>
</f:facet>
</p:cellEditor>
</p:column>
//more columns with cell editors
<p:column>
<p:rowEditor />
</p:column>
</p:dataTable>
36
FIGURE 2.11: CELL EDIT DATATABLE
2.3.10 Cell Selection in Datatable
Cell selection is used to select particular cell(s) in datatable, two different modes are
supported; ‘singlecell’ and ‘multiplecell’. Selected cells are passed to the backing bean
as org.primefaces.model.Cell instances.
<p:dataTable var="car" value="#{carBean.cars}"
Selection ="#{carBean.selectedCell}"
selectionMode ="singlecell">
...columns
</p:dataTable>
37
public class CarBean {
private List<Car> cars;
private Cell selectedCell;
//getters and setters
}
38
2.4 JQuery
jQuery is a fast and concise JavaScript library created by John Resig in 2006. jQuery
simplifies HTML document traversing, event handling, animating, and Ajax interactions
for Rapid Web Development
FIGURE 2.12: JQUERY LOGO
2.4.1 Execute JQuery
We can execute JQuery using following method as online execute. This will display “This
is First” text on web page. Then we can identify execution is happen properly with our
program.
<html>
<head>
<title>jQuery</title>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.j
s">
</script>
<script type="text/javascript">
$(document).ready(function()
{document.write("This First");});
</script>
39
</head>
<body>
<h1>Hello</h1>
</body>
</html>
2.4.2 Features Support by JQuery
jQuery is a JavaScript toolkit designed to simplify various tasks by writing less code.
Here is the list of important core features supported by jQuery −
DOM manipulation − The jQuery made it easy to select DOM elements, traverse
them and modifying their content by using cross-browser open source selector
engine called Sizzle.
Event handling − The jQuery offers an elegant way to capture a wide variety of
events, such as a user clicking on a link, without the need to clutter the HTML
code itself with event handlers.
AJAX Support − The jQuery helps you a lot to develop a responsive and feature-
rich site using AJAX technology.
Animations − The jQuery comes with plenty of built-in animation effects which
you can use in your websites.
Lightweight − The jQuery is very lightweight library - about 19KB in size (
Minified and gzipped ).
Latest Technology − The jQuery supports CSS3 selectors and basic XPath
syntax.
40
2.4.3 DOM Manipulation
JQuery provides methods to manipulate DOM in efficient way. You do not need to write
big code to modify the value of any element's attribute or to extract HTML code from a
paragraph or division.
JQuery provides methods such as .attr(), .html(), and .val() which act as getters,
retrieving information from DOM elements for later use.
2.4.4 Example 8
Following is an example which makes use of .html() and .text(val) methods. Here .html()
retrieves HTML content from the object and then .text( val ) method sets value of the
object using passed parameter
<html>
<head>
<title>The jQuery Example</title><script
type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.j
s"></scrip>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$("div").click(function () {
$(this).replaceWith("<h1>JQuery is Great</h1>");
});
});
</script>
<style>
#division{ margin:10px;padding:12px; border:2px solid
#666; width:60px;}
</style>
</head>
<body>
41
<p>Click on the square below:</p>
<span id="result"> </span>
<div id="division" style="background-color:Red;">
This is Red Square!!
</div>
</body>
</html>
2.4.5 Events Handling
We have the ability to create dynamic web pages by using events. Events are actions that
can be detected by our Web Application.
Following are the examples events −
A mouse click
A web page loading
Taking mouse over an element
Submitting an HTML form
A keystroke on your keyboard
2.4.6 Binding Event Handling
Using the jQuery Event Model, we can establish event handlers on DOM elements with
the bind() method as follows –
<html>
<head>
<title>The jQuery Example</title>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.j
s"></script>
42
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$('div').bind('click', function( event ){
alert('This is alert');
});
});
</script>
<style>
.div{ margin:12px;padding:10px; border:1px solid #ccc;
width:50px;}
</style>
</head>
<body>
<p>Click follow:</p>
<div class="div" style="background-color:blue;">ONE</div>
<div class="div" style="background-color:green;">TWO</div>
<div class="div" style="background-color:red;">THREE</div>
</body>
</html>
This code will cause the division element to respond to the click event; when a user clicks
inside this division thereafter, the alert will be shown.
2.4.7 Ajax
AJAX is an acronym standing for Asynchronous JavaScript and XML and this technology
help us to load data from the server without a browser page refresh.
43
URL − The URL of the server-side resource to which the request is sent. It could
be a CGI, ASP, JSP, or PHP script which generates data dynamically or out of a
database.
data − This optional parameter represents an object whose properties are
serialized into properly encoded parameters to be passed to the request. If
specified, the request is made using the POST method. If omitted,
the GET method is used.
callback − A callback function invoked after the response data has been loaded
into the elements of the matched set. The first parameter passed to this function
is the response text recieved from the server and second parameter is the status
code.
2.4.8 Getting JSON Data
There would be a situation when server would return JSON string against our request.
JQuery utility function getJSON() parses the returned JSON string and makes the
resulting string available to the callback function as first parameter to take further action.
URL − The URL of the server-side resource contacted via the GET method.
data − An object whose properties serve as the name/value pairs used to construct
a query string to be appended to the URL, or a preformatted and encoded query
string.
callback − A function invoked when the request completes. The data value
resulting from digesting the response body as a JSON string is passed as the first
parameter to this callback, and the status as the second.
2.4.9 Example 9
<html>
<head>
<title>The Ajax</title>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.j
s"></script>
44
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$("#driver").click(function(event){
$.getJSON('/jquery/result.json', function(jd) {
$('#stage').html('<p> Name: ' + jd.name + '</p>');
$('#stage').append('<p>Age : ' + jd.age+ '</p>');
$('#stage').append('<p>Sex: ' + jd.sex+ '</p>');
});
});
});
</script>
</head>
<body>
<p>Click on the button</p>
<div id="stage" style="background-color:#eee;">
BUTTON
</div>
<input type="button" id="driver" value="Load Data" />
</body>
</html>
Here JQuery utility method getJSON() initiates an Ajax request to the specified URL
result.json file. After loading this file, all the content would be passed to the callback
function which finally would be populated inside <div> tagged with ID stage.
45
2.5 CSS Technique
FIGURE 2.13: CSS LOGO
Cascading Style Sheets, fondly referred to as CSS, is a simple design language intended
to simplify the process of making web pages presentable.
CSS handles part of a web page. Using CSS, we can control the color of the text, the style
of fonts, the spacing between paragraphs, how columns are size, what background images
or colors are used, as well as a variety of other effects.
CSS is easy to use and understand but it provides powerful control over the presentation
of an HTML document. Most commonly, CSS is combined with the markup languages
HTML or XHTML.
2.5.1 Execute CSS
We can execute CSS using following method as online execute
<html>
<head>
<title>CSS</title>
<link href="./tablecloth/tablecloth/tablecloth.css"
rel="stylesheet" type="text/css" />
<style>
h1{
46
color: #ccc;
font-size: 100%;
text-transform: lowercase;
}
</style>
</head>
<body>
<h1>This is CSS</h1>
</body>
</html>
2.5.2 CSS Selectors
There are many numbers of method to select elements where style will be applied.
Following discuss that methods using examples.
2.5.2.1 Type Selectors
We can all <h1> using following code.
h1 {
color: #36CFFF;
}
2.5.2.2 Universal Selectors
Rather than selecting elements of a specific type, the universal selector quite simply
matches the name of any element type.
* {
color: #000000;
}
2.5.2.3 Class Selectors
47
We can define style rules based on the class attribute of the elements. All the elements
having that class will be formatted according to the defined rule.
h1.black {
color: #000000;
}
2.5.2.4 ID Selectors
We can define id attribute of the elements. All the elements having that id will be
formatted according to the defined rule.
#black {
color: #000000;
}
2.5.3 Setting Backgrounds Using CSS
We can set background using CSS in a different manor adding varies color, images, etc.
Following is the example which demonstrates how to set the background color for an
element.
<p style="background-color:yellow;">
This text has a yellow background color.
</p>
2.5.3.1 Set the Background image
Following is the example which demonstrates how to set the background image for an
element.
<table style="background-image:url(/images/image.png);">
48
<tr><td>
This table has background image set.
</td></tr>
</table>
2.5.3.2 Set the Background image position
Following is the example which demonstrates how to set the background image position
20 pixels away from the left side.
<table style="background-image:url(/images/image.png);
background-position:20px;">
<tr><td>
Background image positioned
</td></tr>
</table>
2.5.3.1 Set the font Size
Following is the example which demonstrates how to set the font size of an element.
The font-size property is used to control the size of fonts.
<p style="font-size:20px;">
This font size is 20 pixels
</p>
<p style="font-size:small;">
This font size is small
</p>
<p style="font-size:large;">
This font size is large
</p>
2.5.4 Set the Table
49
We can in the following example how to add CSS to varies position in the Table like
columns, rows, header & footer etc.
Below example is perform how to style Table.
<style type="text/css">
table.one {border-collapse:collapse;}
table.two {border-collapse:separate;}
td.a {
border-style:dotted;
border-width:3px;
border-color:#000000;
padding: 10px;
}
td.b {border-style:solid;
border-width:3px;
border-color:#333333;
padding:10px;
}
</style>
<table class="one">
<tr><td class="a"> Cell A</td></tr>
<tr><td class="b"> Cell B</td></tr>
</table>
<br />
<table class="two">
<tr><td class="a"> Cell A</td></tr>
<tr><td class="b"> Cell B</td></tr>
</table>
50
Chapter 3
3.0 Training Experiences (Management) at Mobitel
Management at Mobitel comes with a long hierarchy of positions and people starting with
GCEO of Sri Lanka Telcom and its subsidiaries. There are several subsidiaries of Sri
Lanka Telecom like SLT visioncom, SLT publications etc. Mobitel is the largest among
them. Mobitel has group of sectional general managers as Marketing, Engineering,
Finance, Corporate, Sales and Distribution, Customer Care, etc. I was appointed to train
at Engineering division of Mobitel (Pvt) Ltd. And there are general managers for each
subsection of the engineering division. Then there are head engineers and supervising
technical officers in relevant sections.
3.1 Administrative and Office Practice
Even though there are lot of position holders within the same office premise, a visitor
wouldn’t be able to tell who is who unless they are on their office rooms with nameplates
on it. What the visitor will see is a team working together to achieve a single goal. The
relation between executive and his subordinates is a very friendly one. In this
environment, there are no masters but only leaders who lead work by example. The
working environment is very punctual and active. Within the two subdivisions I trained
on, I never heard anyone mentioning the position of someone when calling each other.
Instead they always used the first name. I also got a chance to participate for official
conversation with peoples who in my team. It was new experience for me.
I was expecting a strict and monotonous office when I first came in as that was the image
I had on ordinary offices. But soon I realized either I was wrong on offices or Mobitel
engineering division is an exception for that. The working environment is joyful and very
friendly. There were no big distinction between engineers, technical officers and other
staff. We as trainees were able to get on with the working people and their work easily
because of this environment. Another thing I saw is the people in this office are truly
working hard to fulfill the required work. Managers don’t have to force people to do this
and that, instead they only have to point out what has to be done and they perform it as of
something of their own.
51
Mobitel as a company follows open door practice, which gives the opportunity for
everyone to express their ideas and views on company related manners. There are no
obligations for a minor worker to go to a manager and give his/her ideas or any
complaints. Actually they are encouraged to do that. When some decision has to be made
on some section, mangers conduct a meeting for everyone and discuss about it. Final
decision is taken with the concern of everyone. I believe this ‘everyone matters’ concept
is very good and actually helps the company to make better moves.
Orderliness of the office environment is at a good level. There are places assigned and
labeled for every equipment and tool from SIM cards to DT equipment used in the office.
So finding something is very easy. Here at Mobitel engineering division all personnel
follows 5S scheme on maintaining orderliness. It even won awards for its ordered and
efficient working environment.
3.2 Measures to motivate staff
As mentioned previously working environment at Mobitel engineering division is free
and joyful. That does motivate people to work as with such factors employees don’t feel
work as a burden but a challenge. They give employees chances to socially gather and
that will ultimately enhance the unity of them. They’ll share their experiences, knowledge
and that will lead to more effective and functional working people. They gave to us their
knowledge by organizing special lectures for us regarding field and working experience
also modern techniques. There are trainings, motivation camps conducted for the
employees for self-development of them. That benefits individuals as well as the
company.
52
Chapter 4
4.0 Summary and Conclusions
4.1 Summary of the 12 weeks training at Mobitel
I was selected as a trainee at Engineering Division of Mobitel (Pvt) Ltd. During that 12
weeks period I gained lot of knowledge and experience regarding the software and
database management field, interactions with the officials and more.
At VAS & PHP division I had lot of chances to get hands on experience with using new
techniques and new software for building website. Training on that section consisted
mostly database management. Therefor I familiar with MySQL and Xampp server when
building project. I took part in some guess lectures as well. I got to opportunity to use
their server it was very useful to refer internet and improve my software knowledge.
This was my first experience as a trainee engineer as well as this was my first experience
at a professional worksite. At the end I was able to collect lot of experiences regarding
practical engineering, professionalism and management.
4.2 Conclusion
Sri Lanka Telecom Mobitel is one of the largest mobile telecommunication operators in
Sri Lanka. So it is very proud me to train in a large company like this as an engineering
undergraduate student. During this 12 weeks period of industrial training I was able to
gain a sound knowledge and have priceless experiences on the software development
industry.
Industrial training period plays a vital role in the overall Engineering undergraduate
curricula in integrating the skills, the knowledge and the attitudes about the industry. I
thought I was very lucky to get selected to Mobitel to have my first industrial training. At
the end of the training I now realize that is more than true. I had real good experience and
knowledge through the training program.
53
During the training I realized that it is impossible to explore all the technologies and
services of software development field during a short time period like 12 weeks. I got to
know some practical applications and related theories with the chances I got during the
training. Not only that but also I got the more experience how to work and deal with
company staff and other locals we meet at our job. I got lot of opportunities to work
together with technical officers and engineers of Mobitel who shared their experiences
and knowledge without any hesitation. Those things gave me a really good training to my
engineering undergraduate life.
Considering the overall training experience I can be satisfied about the experience gained
during my stay at Mobitel Engineering division. Mobitel people conducted few lectures
for us to clarify some theories. A trainee section rotation program according to a
preplanned schedule was launched during my training period at Mobitel. I think it makes
this training better. Even with a large number of trainees, people at Mobitel engineer
division did their best for providing a nice and effective training with maximum allocation
of their resources. It was a big opportunity I had to have my first industrial training at
Mobitel (Pvt) Ltd.
54
References
Official Mobitel (Pvt) Ltd. website, 15.05.2014, www.mobitel.lk
MySQL Administration
(http://www.tutorialspoint.com/mysql/mysql-administration.htm)
Primefaces Showcase Domain
(Primefaces_users_guide)
JQuery
(http://www.tutorialspoint.com//jquery/index.htm)
CSS
(http://www.w3schools.com/css/)
55