Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 1

How to build a simple point of sale system using PHP and Jquery. This article is a series of several of my articles about CRUD. Here I will focus on making a simple point of sale with PHP, MYSQL, Jquery, PDO and ADMINLTE Framework. I will divide this article into sections where each section will implement the module from the POS.

What is the point of sale (POS)? A point of sale is also called cashier program. This program is used for information systems in stores. Some modules that exist on POS Systems such as record customer data, suppliers, sales, purchases, print sales notes, print reports and much more. By building this PHP POS program you can earn a lot of money by selling it at the shops around you.

Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 1

In this article, I will not create all modules from POS. If you want me to make a complete POS module, you have to pay me with a high-cost :p LOL.

Some of the equipment needed

1. PHP Server (XAMPP or you can install apache and PHP server in Linux)
2. PHP (Having used PDO as a MySQL connection, this application has support for PHP 7)
3. MySQL Database
4. Jquery Library
5. Admin LTE Template, download here.

Some support plugins include:

  1. Sweetalert.js plugin (Beautiful plugin alerts to replace standard javascript alerts).
  2. Hotkey.js plugin (Create a shortcut button with javascript).
  3. Redirect.js plugin (used to send POST data using javascript).
  4. Datatables bootstrap plugin (used to create responsive tables).
  5. Bootstrap notify plugin (used to display notifications).
  6. Myfunction.js, a collection of my javascript functions that will use to speed up build the application
  7. session_checker.js, my jquery script to check session every time page loaded.

You can download all supported file in the link below

supported file download link

The module will be created in this tutorial:

  1. Creating login page – Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 1.
  2. Create Dynamic Menu and Dashboard Page – Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 2.
  3. Create Master User Form – Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 3.
  4. Create Master Item / Product Form – Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 4.
  5. Creating Sales Form / Point of sale – Tutorial Build Point Of Sale With PHP, PDO, MySQL And Jquery Part 5

And as a bonus article, I will include an article how to create a shopping receipt with PHP and FPDF.

As a preliminary preparation, please create a MySQL database with the name “pos“. Add 1 table named m_user. As shown below

Create Pos Database And M User Table Tutorial Build Point Of Sale With PHP PDO MySQL And Jquery

Add a new user with the following query

Okay, let’s begin the tutorial

Tutorial create login page with PHP and AdminLTE Templates

1. Create a project folder with the name “pos
2. Make sure you have downloaded the adminLTE template, if not please download at the official site here
3. Extract the adminLTE template into the “pos” project folder
4. Add new folders “application“, “image” and “library” in the pos folder.
5. Add 6 new folders into “application” folder: layout, main, master, model, sales, utility.
6. Create 4 PHP files inside the “library” folder: check_access.php, check_login.php, checksession.php and config.php. Then fill the entire file with the following script:


Check_access.php used to check user access every time user visit the menu. If the user does not have access to a menu will be given a warning restricted access with a “warning” image like below:

Restricted Access


check_login.php used to check user session. If the user does not have a login session, it will be redirected to the login page


checksession.php used to check user session. If the user session has been exhausted it will be redirected to the login page


7. Create 5 PHP files inside the “layout” folder: bottom-footer-table.php, bottom-footer.php, footer.php, header.php, top-header.php. Then fill the entire file with the following script:



For a while we ignore header.php first, I will discuss in part 2



5 files are used to create an adminLTE layout. Divided into five sections to be easy to manage bootstrap adminLTE view

8. Add a warning image into “image” folder


9. Do not forget to put supporting files in the right folder

  • sweetalert.js → pos/dist/js/ folder
  • hotkey.js → pos/dist/js/ folder
  • check_session.js → pos/dist/js/ folder
  • myfunction.js → pos/dist/js/ folder
  • bootstrap-notify folder → pos/plugin/ folder
  • sweetalert.css → pos/dist/css/ folder
  • loadbargood.js → pos/dist/js/ folder

10. Create custom.css and put on the pos/dist/css/ folder. Copy the following CSS script into custom.css file

Make sure your folder structure like the following image

Folder Structure Pos Project Tutorial Create Point Of Sale With Php

The entire file and code in the above is a supporting file, the next step we will create the first module that is creating a login form.

Create 4 PHP file in the main folder (pos/application/main/) like the following image:

Main Folder


index.php is a dashboard page. For a while we just give the code as above, we will change in the next article


The focus on the login page is the error code when it fails to login, you can change these code with your own.



The form on the login page will take us to the authorization page. The authorization of this page will check whether the user has access to the system. And the system will set the session to the user

The next step we will create PHP file Which is used to hold a collection of MySQL queries and SQL database connections with PDO.

Add 2 PHP file as dbconn.php and pos.php in the “model” folder (pos/application/main/)


dbconn.php used to save MySQL config with PDO


The creation of login page has been completed, before test, the application on the browser make sure you edit .htaccess and index.php (pos/index.php) file in the folder “pos



Please test your application via browser with following address: http://localhost/pos/

Login Page

If successful login, you will be taken to the index page as shown below:

Dashboard Page

If any questions please fill in the comment form below. The complete project can be downloaded in the last article of this tutorial (Article Part 5).

The first part of the tutorial has been completed, The next section will create a dynamic menu and dashboard page on adminLTE

The following two tabs change content below.
This site is a personal Blog of Sigit Prasetya Nugroho, a Desktop developer and freelance web developer working in PHP, MySQL, WordPress.


 Add your comment
  1. Nice tutorial, thanks so much bro!

  2. Tidak bisa login

    Fatal error: ‘break’ not in the ‘loop’ or ‘switch’ context in C:\xampp\htdocs\pos\application\main\authorization.php on line 11

  3. Hi , could you please help me.
    I have downloaded the complete source code, but cannot login to the system, could you please let me know the username and password.
    many thanks

  4. hi, i have error of invalid password.. although i check the database..its all the same..

  5. oh my gold
    Can’t login broth

    Sign in to start your session



    Invalid email or password
    Copyright © 2019 Seegatesite.com., inc. All rights reserved

    some thing like this

  7. “can not connect database”

    to login do I insert the username and password from “dbconn.php” on the lines “$dbuserx = ‘root; $dbpassx = ‘123456’;”?
    or do I use the username and password from the m_user table?

  8. I’d an error with authorization.php recently. PHP “break” generated 500 Internal Error Server. I’m not really sure but it can be cause I’m using PHP7 and break is exclusive for loop-sentences or switch

Leave a Comment

Your email address will not be published.

Time limit is exhausted. Please reload CAPTCHA.

This site uses Akismet to reduce spam. Learn how your comment data is processed.