You are on page 1of 22

Project Report

Project Name Online E-Ticketing System


Team Members
Yasir Siddique BSEM-F17-022
Mateen Nawaz BSCM-F17-028
Hassan Mehmood BSCM-F17-031

Online E-Ticketing System


Summary:
We provide an important mode of transportation in farthest corner of Pakistan. We are truly dedicated to
make our service as simple and unique. Now with this web-site you can easily book a railway tickets with
ease.

Introduction:
We introduced online buying of train tickets in metropolitan (Lahore, Karachi, Islamabad) city of Pakistan.
It is user friendly site where people can review train schedule and reserve seats through mobile phone. This
Site used for E-ticketing service for Railway. This is simple and user-friendly web-site which help the
railway system in all aspects. In this site you can find all the packages with your desired location. You can
also send us your feedback about our services.

Home page

Figure 1 Home Page

Packages page

Figure 2 packages page


Contact Page

Figure 3 contact us

Booking Page

Figure 4 booking page

About us Page

Figure 5 about us
Code:
Home Page
<!DOCTYPE html>
<html lang="en">

<head>
<link rel="shortcut icon" href="img/bookmytrain.jpg">
<title>E-Ticketing</title>

<link href="https://fonts.googleapis.com/css?family=Poppins:100,200,400,300,500,600,700" rel="stylesheet">


<!--
CSS
============================================= -->
<link rel="stylesheet" href="css/linearicons.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="css/nice-select.css">
<link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header id="header">

<div class="container main-menu">


<div class="row align-items-center justify-content-between d-flex">
<div id="logo">
<a href="index.html"><img src="img/bookmytrain.jpg" height="40" alt="" title="" /></a>
</div>
<nav id="nav-menu-container">
<ul class="nav-menu">
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</nav><!-- #nav-menu-container -->
</div>
</div>
</header><!-- #header -->
<!-- start banner Area -->
<section class="banner-area relative">
<div class="overlay overlay-bg"></div>
<div class="container">
<div class="row fullscreen align-items-center justify-content-between">
<div class="col-lg-6 col-md-6 banner-left">
<h6 class="text-white">Live life a new way</h6>
<h1 class="text-white">E-Ticketing</h1>
<p class="text-white">
We got here the best trains ticket booking wesite for you to travel through country by train , to visit your loved one and to see the beauties of our country. You will find the lowest prices of
all time here.
</p>
<a href="booking.html" class="primary-btn text-uppercase">Book now </a>
</div>
</div>
</div>
</section>
<!-- End banner Area -->
<!-- Start popular-destination Area -->
<section class="popular-destination-area section-gap">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="menu-content pb-70 col-lg-8">
<div class="title text-center">
<h1 class="mb-10">Popular Destinations</h1>
<p>We are living in time where you go and travel almost any place at any time, to enjoy the wonders of this world.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="single-destination relative">
<div class="thumb relative">
<div class="overlay overlay-bg"></div>
<img class="img-fluid" src="img/lahore.jpg" alt="">
</div>
<div class="desc">
<a href="#" class="price-btn">1500rs</a>
<h4>Lahore</h4>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="single-destination relative">
<div class="thumb relative">
<div class="overlay overlay-bg"></div>
<img class="img-fluid" src="img/isl.jpg" alt="">
</div>
<div class="desc">
<a href="#" class="price-btn">2500rs</a>
<h4>Islammabad</h4>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="single-destination relative">
<div class="thumb relative">
<div class="overlay overlay-bg"></div>
<img class="img-fluid" src="img/the-karachi-saga-e1d98379960208796b111363feef0966.jpg" alt="" c>
</div>
<div class="desc">
<a href="#" class="price-btn">5000rs</a>
<h4>Karachi</h4>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End popular-destination Area -->
<!-- Start price Area -->
<section class="price-area section-gap">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="menu-content pb-70 col-lg-8">
<div class="title text-center">
<h1 class="mb-10">We Provide Affordable Prices</h1>
<p>We provide rates that suites every one. We have all kind of different packages for all.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="single-price">
<h4>Cheap Packages</h4>
<ul class="price-list">
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">lahore</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">multan</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">peshawar</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">karachi</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">quetta</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">faislabad</span>
<a href="#" class="price-btn">1500rs</a>
</li>
</ul>
</div>
</div>
<div class="col-lg-4">
<div class="single-price">
<h4>family Packages</h4>
<ul class="price-list">
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">lahore</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">multan</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">peshawar</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">karachi</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">quetta</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">faislabad</span>
<a href="#" class="price-btn">2500rs</a>
</li>
</ul>
</div>
</div>
<div class="col-lg-4">
<div class="single-price">
<h4>Luxury Packages</h4>
<ul class="price-list">
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">lahore</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">multan</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">peshawar</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">karachi</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">quetta</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray" style="color: gray">faislabad</span>
<a href="#" class="price-btn">3500rs</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- End price Area -->
<!-- Start other-issue Area -->
<section class="other-issue-area section-gap">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="menu-content pb-70 col-lg-9">
<div class="title text-center">
<h1 class="mb-10">Other issues we can help you with</h1>
<p>We care about our customer and help them meet there needs during there travel.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="single-other-issue">
<div class="thumb">
<img class="img-fluid" src="img/car-rental-2.jpg" alt="">
</div>
<a href="#">
<h4>Rent a Car</h4>
</a>
<p>
Best cars, couches, and mini bus are avalible at all time.
</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="single-other-issue">
<div class="thumb">
<img class="img-fluid" src="img/86820261.jpg" alt="">
</div>
<a href="#">
<h4>Rooms booking</h4>
</a>
<p>
We are in agreement with many of the finest hotels across the country.
</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="single-other-issue">
<div class="thumb">
<img class="img-fluid" src="img/to-do-list-compressor.jpg" alt="">
</div>
<a href="#">
<h4>To Do List</h4>
</a>
<p>
We could came with the best shedule for you travel.
</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="single-other-issue">
<div class="thumb">
<img class="img-fluid" src="img/013e37d488829fc576b29730b6b4036a.jpg" alt="">
</div>
<a href="#">
<h4>Food Features</h4>
</a>
<p>
With ongoing travling, good food is nesscity.
</p>
</div>
</div>
</div>
</div>
</section>
<!-- End other-issue Area -->
<!-- Start home-about Area -->
<section class="home-about-area">
<div class="container-fluid">
<div class="row align-items-center justify-content-end">
<div class="col-lg-6 col-md-12 home-about-left">
<h1>
Did not find your Package? <br>
Feel free to ask us. <br>
We‘ll fin it for you
</h1>
<p>
You'll get comprehensive tracking events history, delivery time estimate, current parcel status and location and links to each official carrier website with prefilled tracking id, so you can be
sure tracking info is up to date.
</p>
<a href="packages.html" class="primary-btn text-uppercase">Find package</a>
</div>
<div class="col-lg-6 col-md-12 home-about-right no-padding">
<img class="img-fluid" src="img/bons.jpg" alt="">
</div>
</div>
</div>
</section>
<!-- End home-about Area -->
<!-- start footer Area -->
<footer class="footer-area section-gap">
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>About team</h6>
<p>
A team is a group of individuals working together to achieve their goal. As defined by Professor Leigh Thompson of the Kellogg School of Management, A team is a group of people
who are interdependent with respect to information, resources, and skills and who seek to combine their efforts to achieve a common goal
</p>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>Navigation Links</h6>
<div class="row">
<div class="col">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget mail-chimp">
<h6 class="mb-20">InstaFeed</h6>
<ul class="instafeed d-flex flex-wrap">
<li><img src="img/i1.jpg" alt=""></li>
<li><img src="img/i2.jpg" alt=""></li>
<li><img src="img/i3.jpg" alt=""></li>
<li><img src="img/i4.jpg" alt=""></li>
<li><img src="img/i5.jpg" alt=""></li>
<li><img src="img/i6.jpg" alt=""></li>
<li><img src="img/i7.jpg" alt=""></li>
<li><img src="img/i8.jpg" alt=""></li>
</ul>
</div>
</div>
</div>
<div class="row footer-bottom d-flex justify-content-between align-items-center">
<p class="col-lg-8 col-sm-12 footer-text m-0">
<div class="col-lg-4 col-sm-12 footer-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
</div>
</div>
</footer>
<!-- End footer Area -->
<script src="js/vendor/jquery-2.2.4.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/easing.min.js"></script>
<script src="js/hoverIntent.js"></script>
<script src="js/superfish.min.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.nice-select.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/mail-script.js"></script>
<script src="js/main.js"></script>
</body>
</html>

Package Page
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="shortcut icon" href="img/bookmytrain.jpg">
<title>E-Ticketing</title>
<link href="https://fonts.googleapis.com/css?family=Poppins:100,200,400,300,500,600,700" rel="stylesheet">
<!--
CSS ============================================= -->
<link rel="stylesheet" href="css/linearicons.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="css/nice-select.css">
<link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header id="header">
<div class="container main-menu">
<div class="row align-items-center justify-content-between d-flex">
<div id="logo">
<a href="index.html"><img src="img/bookmytrain.jpg" height="40" alt="" title="" />
</div>
<nav id="nav-menu-container">
<ul class="nav-menu">
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</ul>
</nav><!-- #nav-menu-container -->
</div>
</div>
</header><!-- #header -->
<!-- start banner Area -->
<section class="about-banner relative">
<div class="overlay overlay-bg"></div>
<div class="container">
<div class="row d-flex align-items-center justify-content-center">
<div class="about-content col-lg-12">
<h1 class="text-white">
Tour Packages
</h1>
<p class="text-white link-nav"><a href="index.html">Home </a> <span class="lnr lnr-arrow-right"></span> <a href="packages.html"> Tour Packages</a></p>
</div>
</div>
</div>
</section>
<!-- End banner Area -->
<!-- Start awesome deal area -->
<section class="awesome-deal-area section-gap">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="menu-content pb-70 col-lg-8">
<div class="title text-center">
<h1 class="mb-10">Today Awesome Deals</h1>
<p>The best deal of the day that could be given today is here check it now and book it and also enjoy your travel</p>
</div>
</div>
</div>
<div class="row justify-content-center">
<div class="col-lg-12 active-hot-deal-carusel">
<div class="single-carusel">
<div class="thumb relative">
<div class="overlay overlay-bg"></div>
<img class="img-fluid" src="img/murree-660x330.jpg" height="900" width="600" alt="">
</div>
<div class="price-detials">
<a href="#" class="price-btn">Starting From <span>2500rs</span></a>
</div>
<div class="details">
<h4 class="text-white">Frozen beautiy</h4>
<p class="text-white">
Murree, Pakistan
</p>
</div>
</div>
<div class="single-carusel">
<div class="thumb relative">
<div class="overlay overlay-bg"></div>
<img class="img-fluid" src="img/murree-660x330.jpg" height=" 900" width="600" alt="">
</div>
<div class="price-detials">
<a href="#" class="price-btn">Starting From <span>2500rs</span></a>
</div>
<div class="details">
<h4 class="text-white">Frozen beautiy</h4>
<p class="text-white">
Murree, Pakistan
</p>
</div>
</div>
<div class="single-carusel">
<div class="thumb relative">
<div class="overlay overlay-bg"></div>
<img class="img-fluid" src="img/murree-660x330.jpg" height="900" width="600" alt="">
</div>
<div class="price-detials">
<a href="#" class="price-btn">Starting From <span>2500rs</span></a>
</div>
<div class="details">
<h4 class="text-white">Frozen beautiy</h4>
<p class="text-white">
Murree, Pakistan
</p>
</div>
</div>

</div>
</div>
</div>
</section>
<!-- End hot-deal Area -->
<!-- Start destinations Area -->
<section class="destinations-area section-gap">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="menu-content pb-40 col-lg-8">
<div class="title text-center">
<h1 class="mb-10">Popular Destinations</h1>
<p>We all live in an age that belongs to the young at heart. Life that is becoming extremely fast, day to.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="single-destinations">
<div class="thumb">
<img src="img/Neelum-Valley.jpg" alt="" class="img-responsive">
</div>
<div class="details">
<h4>Holiday at Azad Kashmir </h4>
<p>
Pakistan
</p>

</div>
</div>
</div>
<div class="col-lg-4">
<div class="single-destinations">
<div class="thumb">
<img src="img/northern-areas-of-Pakistan-shangrila.jpg" alt="" class="img-responsive">
</div>
<div class="details">
<h4>Holiday at north areas</h4>
<p>
Pakistan
</p>

</div>
</div>
</div>
<div class="col-lg-4">
<div class="single-destinations">
<div class="thumb">
<img src="img/south.jpg" alt="" class="img-responsive">
</div>
<div class="details">
<h4>Holiday at southern areas</h4>
<p>
Pakistan
</p>

</div>
</div>
</div>
<div class="col-lg-4">
<div class="single-destinations">
<div class="thumb">
<img src="img/maxresdefault-53-1.jpg" alt="" class="img-responsive">
</div>
<div class="details">
<h4>Holiday at Islamabad</h4>
<p>
Isalamabd , Pakistan
</p>

</div>
</div>
</div>
<div class="col-lg-4">
<div class="single-destinations">
<div class="thumb">
<img src="img/pakistannewyear.jpg" alt="" class="img-responsive">
</div>
<div class="details">
<h4>Holiday at lahore</h4>
<p>
Lahore ,Pakistan
</p>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="single-destinations">
<div class="thumb">
<img src="img/19665613_10154901596223137_617798039035923021_n-515x341.jpg" alt="" class="img-responsive">
</div>
<div class="details">
<h4>Holiday at Beach</h4>
<p>
Karachi Pakistan
</p>

</div>
</div>
</div>
<!-- End destinations Area -->
<!-- Start home-about Area -->
<section class="home-about-area">
<div class="container-fluid">
<div class="row align-items-center justify-content-end">
<div class="col-lg-6 col-md-12 home-about-left">
<h1>
Did not find your Package? <br>
Feel free to ask us. <br>
We‘ll make it for you
</h1>
<p>
inappropriate behavior is often laughed off as “boys will be boys,” women face higher conduct standards especially in the workplace. That’s why it’s crucial that, as women, our behavior on the
job is beyond reproach. inappropriate behavior is often laughed.
</p>
</div>
<div class="col-lg-6 col-md-12 home-about-right no-padding">
<img class="img-fluid" src="img/bons.jpg" alt="">
</div>
</div>
</div>
</section>
<!-- End home-about Area -->
<!-- start footer Area -->
<footer class="footer-area section-gap">
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>About Team</h6>
<p>
A team is a group of individuals working together to achieve their goal. As defined by Professor Leigh Thompson of the Kellogg School of Management, A team is a group of people who are
interdependent with respect to information, resources, and skills and who seek to combine their efforts to achieve a common goal
</p>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>Navigation Links</h6>
<div class="row">
<div class="col">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget mail-chimp">
<h6 class="mb-20">InstaFeed</h6>
<ul class="instafeed d-flex flex-wrap">
<li><img src="img/i1.jpg" alt=""></li>
<li><img src="img/i2.jpg" alt=""></li>
<li><img src="img/i3.jpg" alt=""></li>
<li><img src="img/i4.jpg" alt=""></li>
<li><img src="img/i5.jpg" alt=""></li>
<li><img src="img/i6.jpg" alt=""></li>
<li><img src="img/i7.jpg" alt=""></li>
<li><img src="img/i8.jpg" alt=""></li>
</ul>
</div>
</div>
</div>
<div class="row footer-bottom d-flex justify-content-between align-items-center">
<p class="col-lg-8 col-sm-12 footer-text m-0">
<div class="col-lg-4 col-sm-12 footer-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
</div>
</div>
</footer>
<!-- End footer Area -->
<script src="js/vendor/jquery-2.2.4.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/easing.min.js"></script>
<script src="js/hoverIntent.js"></script>
<script src="js/superfish.min.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.nice-select.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/mail-script.js"></script>
<script src="js/main.js"></script>
</body>
</html>

Contact Page
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="shortcut icon" href="img/bookmytrain.jpg">
<title>Trains</title>

<link href="https://fonts.googleapis.com/css?family=Poppins:100,200,400,300,500,600,700" rel="stylesheet">


<!--
CSS
============================================= -->
<link rel="stylesheet" href="css/linearicons.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="css/nice-select.css">
<link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header id="header">
<div class="container main-menu">
<div class="row align-items-center justify-content-between d-flex">
<div id="logo">
<a href="index.html"><img src="img/bookmytrain.jpg" height="40" alt="" title="" /></a>
</div>
<nav id="nav-menu-container">
<ul class="nav-menu">
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</nav><!-- #nav-menu-container -->
</div>
</div>
</header><!-- #header -->
<!-- start banner Area -->
<section class="relative about-banner">
<div class="overlay overlay-bg"></div>
<div class="container">
<div class="row d-flex align-items-center justify-content-center">
<div class="about-content col-lg-12">
<h1 class="text-white">
Contact Us
</h1>
<p class="text-white link-nav"><a href="index.html">Home </a> <span class="lnr lnr-arrow-right"></span> <a href="contact.html"> Contact Us</a></p>
</div>
</div>
</div>
</section>
<!-- End banner Area 
<!-- our team -->
<!-- Start contact-page Area -->
<section class="contact-page-area section-gap">
<div class="container">
<div class="row">
<div class="col-lg-4 d-flex flex-column address-wrap">
<div class="single-contact-address d-flex flex-row">
<div class="icon">
<span class="lnr lnr-home"></span>
</div>
<div class="contact-details">
<h5>Model town, Lahore</h5>
<p>
43 Model Town Link Road
</p>
</div>
</div>
<div class="single-contact-address d-flex flex-row">
<div class="icon">
<span class="lnr lnr-phone-handset"></span>
</div>
<div class="contact-details">
<h5>042 754 562</h5>
<p>Mon to Fri 9am to 5 pm</p>
</div>
</div>
<div class="single-contact-address d-flex flex-row">
<div class="icon">
<span class="lnr lnr-envelope"></span>
</div>
<div class="contact-details">
<h5>bookmytrain@gmail.com</h5>
<p>Ask us anything anytime!</p>
</div>
</div>
</div>
<div class="col-lg-8">
<form class="form-area contact-form text-right" id="myForm" action="mail.php" method="post">
<div class="row">
<div class="col-lg-6 form-group">
<input name="name" placeholder="Enter your name" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter your name'" class="common-input mb-20 form-control"
required="" type="text">

<input name="email" placeholder="Enter email address" pattern="[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{1,63}$" onfocus="this.placeholder = ''" onblur="this.placeholder =


'Enter email address'" class="common-input mb-20 form-control" srequired="" type="email">

<input name="subject" placeholder="Enter subject" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter subject'" class="common-input mb-20 form-control"
required="" type="text">
</div>
<div class="col-lg-6 form-group">
<textarea class="common-textarea form-control" name="message" placeholder="Enter Messege" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter Messege'"
required=""></textarea>
</div>
<div class="col-lg-12">
<div class="alert-msg" style="text-align: left;"></div>
<button class="genric-btn primary" style="float: right;">Send Message</button>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<!-- End contact-page Area -->
<!-- start footer Area -->
<footer class="footer-area section-gap">
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>About Team</h6>
<p>
A team is a group of individuals working together to achieve their goal. As defined by Professor Leigh Thompson of the Kellogg School of Management, A team is a group of people
who are interdependent with respect to information, resources, and skills and who seek to combine their efforts to achieve a common goal

</p>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>Navigation Links</h6>
<div class="row">
<div class="col">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget mail-chimp">
<h6 class="mb-20">InstaFeed</h6>
<ul class="instafeed d-flex flex-wrap">
<li><img src="img/i1.jpg" alt=""></li>
<li><img src="img/i2.jpg" alt=""></li>
<li><img src="img/i3.jpg" alt=""></li>
<li><img src="img/i4.jpg" alt=""></li>
<li><img src="img/i5.jpg" alt=""></li>
<li><img src="img/i6.jpg" alt=""></li>
<li><img src="img/i7.jpg" alt=""></li>
<li><img src="img/i8.jpg" alt=""></li>
</ul>
</div>
</div>
</div>
<div class="row footer-bottom d-flex justify-content-between align-items-center">
<p class="col-lg-8 col-sm-12 footer-text m-0">
<div class="col-lg-4 col-sm-12 footer-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
</div>
</div>
</footer>
<!-- End footer Area -->
<script src="js/vendor/jquery-2.2.4.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/easing.min.js"></script>
<script src="js/hoverIntent.js"></script>
<script src="js/superfish.min.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.nice-select.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/mail-script.js"></script>
<script src="js/main.js"></script>
</body>
</html>

Booking page
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="shortcut icon" href="img/bookmytrain.jpg">
<title>E-Ticketing</title>
<link type="text/css" rel="stylesheet" href="css/bootstrap.min.css" />
<link type="text/css" rel="stylesheet" href="css/style.css" />
<link href="https://fonts.googleapis.com/css?family=Poppins:100,200,400,300,500,600,700" rel="stylesheet">
<link rel="stylesheet" href="css/linearicons.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="css/nice-select.css">
<link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header id="header">
<div class="header-top">
<div class="container">
</div>
</div>
<div class="container main-menu">
<div class="row align-items-center justify-content-between d-flex">
<div id="logo">
<a href="index.html"><img src="img/bookmytrain.jpg" height="40" alt="" title="" /></a>
</div>
<nav id="nav-menu-container">
<ul class="nav-menu">
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</nav><!-- #nav-menu-container -->
</div>
</div>
</header><!-- #header -->
<div id="booking" class="section">
<div class="section-center">
<div class="container">
<div class="row">
<div class="col-md-7 col-md-push-5">
<div class="booking-cta">
<h1>Make your reservation</h1>
<p>Welcome to the Reservation Self-Service system, where you can make instant seat reservations online. Please note that seats are assigned automatically within the Self-Service. If you make seat
reservations for your party, you will be seated together.
</p>
</div>
</div>
<div class="col-md-4 col-md-pull-7">
<div class="booking-form">
<form action="booking.php" method="post">
<div class="form-group">
<span class="form-label">Enter Your Name</span>
<input class="form-control" name="name" type="text" placeholder="Enter Name">

<span class="form-label">Enter Your Phone Number</span>


<input class="form-control" name="phone" type="numbers" placeholder="Enter a phone Number">

<span class="form-label">Select Your Departure Location</span>


<select style="color: black"name="DepartureLocation" class="form-control-lg" >
<option style="color: black" value="">Select Departure Location</option>
<option style="color: black" value="Lahore">Lahore</option>
<option style="color: black" value="Islamabad">Islamabad</option>
<option style="color: black" value="Karachi">Karachi</option>
<option style="color: black" value="Multan">Multan</option>
<option style="color: black" value="Gujrat">Gujrat</option>
<option style="color: black" value="Kasur">Kasur</option>
<option style="color: black" value="Pattoki">Pattoki</option>
<option style="color: black" value="Sahiwal">Sahiwal</option>
</select>
<span class="form-label">Enter Your Arrival Location</span>
<select style="color: black"name="ArrivalLocation" class="form-control-lg ">
<option style="color: black" value="">Select Arrival Location</option>
<option style="color: black" value="Lahore">Lahore</option>
<option style="color: black" value="Islamabad">Islamabad</option>
<option style="color: black" value="Karachi">Karachi</option>
<option style="color: black" value="Multan">Multan</option>
<option style="color: black" value="Gujrat">Gujrat</option>
<option style="color: black" value="Kasur">Kasur</option>
<option style="color: black" value="Pattoki">Pattoki</option>
<option style="color: black" value="Sahiwal">Sahiwal</option>
</select>
</div>
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<span class="form-label">Select Seats</span>
<select style="color: black"name="seat" class="form-control-lg ">
<option style="color: black" value="">Select Seats</option>
<option style="color: black" value="1">1</option>
<option style="color: black" value="2">2</option>
<option style="color: black" value="3">3</option>
<option style="color: black" value="4">4</option>
<option style="color: black" value="5">5</option>
</select>
<span class="form-label">Mode</span>
<select style="color: black" name="Mode" class="form-control-lg">
<option value="">Select Mode</option>
<option style="color: black" value="Luxury Class">Luxury Class</option>
<option style="color: black" value="Business Class">Business Class</option>
<option style="color: black" value="Economy Class">Economy Class</option>
</select>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<span class="form-label">Booking Date</span>
<input class="form-control" style="color: black" name="date" type="date" required>
</div>
</div>
</div>
<div class="form-btn">
<button class="submit-btn">Confirm Booking</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- start footer Area -->
<footer class="footer-area section-gap">
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>About Team</h6>
<p>
A team is a group of individuals working together to achieve their goal. As defined by Professor Leigh Thompson of the Kellogg School of Management, A team is a group of people who are
interdependent with respect to information, resources, and skills and who seek to combine their efforts to achieve a common goal
</p>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>Navigation Links</h6>
<div class="row">
<div class="col">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget mail-chimp">
<h6 class="mb-20">InstaFeed</h6>
<ul class="instafeed d-flex flex-wrap">
<li><img src="img/i1.jpg" alt=""></li>
<li><img src="img/i2.jpg" alt=""></li>
<li><img src="img/i3.jpg" alt=""></li>
<li><img src="img/i4.jpg" alt=""></li>
<li><img src="img/i5.jpg" alt=""></li>
<li><img src="img/i6.jpg" alt=""></li>
<li><img src="img/i7.jpg" alt=""></li>
<li><img src="img/i8.jpg" alt=""></li>
</ul>
</div>
</div>
</div>
<div class="row footer-bottom d-flex justify-content-between align-items-center">
<p class="col-lg-8 col-sm-12 footer-text m-0">
<div class="col-lg-4 col-sm-12 footer-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
</div>
</div>
</footer>
<!-- End footer Area -->
<script src="js/vendor/jquery-2.2.4.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/easing.min.js"></script>
<script src="js/hoverIntent.js"></script>
<script src="js/superfish.min.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.nice-select.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/mail-script.js"></script>
<script src="js/main.js"></script>
</body>
</html>

About us
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="shortcut icon" href="img/bookmytrain.jpg">
<title>E-Ticketing</title>
<link href="https://fonts.googleapis.com/css?family=Poppins:100,200,400,300,500,600,700" rel="stylesheet">
<!--
CSS
============================================= -->
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header id="header">
<div class="container main-menu">
<div class="row align-items-center justify-content-between d-flex">
<div id="logo">
<a href="index.html"><img src="img/bookmytrain.jpg" height="40" alt="" title="" /></a>
</div>
<nav id="nav-menu-container">
<ul class="nav-menu">
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</nav><!-- #nav-menu-container -->
</div>
</div>
</header><!-- #header -->
<!-- start banner Area -->
<section class="about-banner relative">
<div class="overlay overlay-bg"></div>
<div class="container">
<div class="row d-flex align-items-center justify-content-center">
<div class="about-content col-lg-12">
<h1 class="text-white">
About Us
</h1>
<p class="text-white link-nav"><a href="index.html">Home </a> <span class="lnr lnr-arrow-right"></span> <a href="about.html"> About Us</a></p>
</div>
</div>
</div>
</section>
<!-- End banner Area -->
<!-- Start about-info Area -->
<section class="about-info-area section-gap">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6 info-left">
<img class="img-fluid" src="img/Train-Intermodal-Country-Side.jpg" alt="">
</div>
<div class="col-lg-6 info-right">
<h6>About Us</h6>
<h1>Who We Are?</h1>
<p>
With over a decade of cumulative market experience, we are the leaders in quality control and training, partnering with some of the best-known brands in the region to achieve continuous success.s
</p>
</div>
</div>
</div>
</section>
<!-- End about-info Area -->
<!-- Start price Area -->
<section class="price-area section-gap">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="menu-content pb-70 col-lg-8">
<div class="title text-center">
<h1 class="mb-10">We Provide Affordable Prices</h1>
<p>Well educated, intellectual people, especially scientists at all times demonstrate considerably.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="single-price">
<h4>Cheap Packages</h4>
<ul class="price-list">
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">lahore</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">multan</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">peshawar</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">karachi</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">quetta</span>
<a href="#" class="price-btn">1500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">faislabad</span>
<a href="#" class="price-btn">1500rs</a>
</li>
</ul>
</div>
</div>
<div class="col-lg-4">
<div class="single-price">
<h4>family Packages</h4>
<ul class="price-list">
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">lahore</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">multan</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">peshawar</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">karachi</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">quetta</span>
<a href="#" class="price-btn">2500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">faislabad</span>
<a href="#" class="price-btn">2500rs</a>
</li>
</ul>
</div>
</div>
<div class="col-lg-4">
<div class="single-price">
<h4>Luxury Packages</h4>
<ul class="price-list">
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">lahore</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">multan</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">peshawar</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">karachi</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">quetta</span>
<a href="#" class="price-btn">3500rs</a>
</li>
<li class="d-flex justify-content-between align-items-center">
<span style="color: gray">faislabad</span>
<a href="#" class="price-btn">3500rs</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- End price Area -->
<!-- Start other-issue Area -->
<section class="other-issue-area section-gap">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="menu-content pb-70 col-lg-9">
<div class="title text-center">
<h1 class="mb-10">Other issues we can help you with</h1>
<p>We all live in an age that belongs to the young at heart. Life that is.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="single-other-issue">
<div class="thumb">
<img class="img-fluid" src="img/car-rental-2.jpg" alt="">
</div>
<a href="#">
<h4>Rent a Car</h4>
</a>
<p>
The preservation of human life is the ultimate value, a pillar of ethics and the foundation.
</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="single-other-issue">
<div class="thumb">
<img class="img-fluid" src="img/86820261.jpg" alt="">
</div>
<a href="#">
<h4>Rooms booking</h4>
</a>
<p>
I was always somebody who felt quite sorry for myself, what I had not got compared.
</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="single-other-issue">
<div class="thumb">
<img class="img-fluid" src="img/to-do-list-compressor.jpg" alt="">
</div>
<a href="#">
<h4>To Do List</h4>
</a>
<p>
The following article covers a topic that has recently moved to center stage–at least it seems.
</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="single-other-issue">
<div class="thumb">
<img class="img-fluid" src="img/013e37d488829fc576b29730b6b4036a.jpg" alt="">
</div>
<a href="#">
<h4>Food Features</h4>
</a>
<p>
There are many kinds of narratives and organizing principles. Science is driven by evidence.
</p>
</div>
</div>
</div>
</div>
</section>
<!-- End other-issue Area -->
<!-- start footer Area -->
<footer class="footer-area section-gap">
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>About Team</h6>
<p>
A team is a group of individuals working together to achieve their goal. As defined by Professor Leigh Thompson of the Kellogg School of Management, A team is a group of people who are
interdependent with respect to information, resources, and skills and who seek to combine their efforts to achieve a common goal
</p>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget">
<h6>Navigation Links</h6>
<div class="row">
<div class="col">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="packages.html">Packages</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="booking.html">Booking</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<div class="single-footer-widget mail-chimp">
<h6 class="mb-20">InstaFeed</h6>
<ul class="instafeed d-flex flex-wrap">
<li><img src="img/i1.jpg" alt=""></li>
<li><img src="img/i2.jpg" alt=""></li>
<li><img src="img/i3.jpg" alt=""></li>
<li><img src="img/i4.jpg" alt=""></li>
<li><img src="img/i5.jpg" alt=""></li>
<li><img src="img/i6.jpg" alt=""></li>
<li><img src="img/i7.jpg" alt=""></li>
<li><img src="img/i8.jpg" alt=""></li>
</ul>
</div>
</div>
</div>
<div class="row footer-bottom d-flex justify-content-between align-items-center">
<p class="col-lg-8 col-sm-12 footer-text m-0">
<div class="col-lg-4 col-sm-12 footer-social">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
</div>
</div>
</div>
</footer>
<!-- End footer Area -->
<script src="js/vendor/jquery-2.2.4.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/easing.min.js"></script>
<script src="js/hoverIntent.js"></script>
<script src="js/superfish.min.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.nice-select.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/mail-script.js"></script>
<script src="js/main.js"></script>
</body>
</html>

Booking PHP Code


<?php

$con=new mysqli("localhost","root","","eticketing");

$errno=mysqli_connect_errno();

if($errno)

$error=mysqli_connect_error();

echo "Connection Failed <br>";

echo "Error number = $errno <br>";

echo "Error = $error <br>";

else
{

$Name = $_POST['name'];

$Phone = $_POST['phone'];

$Departure = $_POST['DepartureLocation'];

$Arrival = $_POST['ArrivalLocation'];

$seat=$_POST['seat'];

$Mode=$_POST['Mode'];

$date=$_POST['date'];

$insert= " insert into tickets(Name,Phone,Departure,Arrival,Seats,Mode,BookingDate) Values('$Name','$Phone','$Departure','$Arrival','$seat','$Mode','$date')";

if(mysqli_query($con,$insert))

include('thankyou.html');

else

echo "Error While Inserting the Data";

?>

You might also like