{"id":1779,"date":"2016-08-22T18:50:16","date_gmt":"2016-08-22T18:50:16","guid":{"rendered":"https:\/\/www.codexworld.com\/?p=1779"},"modified":"2026-01-16T14:46:57","modified_gmt":"2026-01-16T14:46:57","slug":"simple-php-shopping-cart-using-sessions","status":"publish","type":"post","link":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/","title":{"rendered":"PHP Shopping Cart System with MySQL using SESSION"},"content":{"rendered":"<p>The <b>shopping cart<\/b> functionality is an important part of every e-commerce project. It helps the user to select and purchase multiple items at once. Also, the online shopping cart allows viewing the selected items and the total price before submitting the order. If you want to build a simple <b>PHP shopping cart<\/b> from scratch, this step-by-step tutorial will help you a lot. In this tutorial, we\u2019ll provide the complete guide and example code to create a simple shopping cart in PHP using SESSION and MySQL.<\/p>\n<p>A shopping cart is a must-have module for any eCommerce website. In this tutorial, you\u2019ll learn how to build a fully functional shopping cart system in PHP using:<\/p>\n<ul>\n<li>MySQL database (MySQLi)<\/li>\n<li>PHP Sessions<\/li>\n<li>AJAX (for add\/update\/remove actions)<\/li>\n<li>A reusable Cart class to manage cart operations<\/li>\n<\/ul>\n<p>This example shopping cart script is designed in a way that can be implemented easily in PHP application, and the tutorial makes it easy to understand the shopping cart concept in the web application. In our example script, we\u2019ll use PHP session to store the product information in the cart. Once the order is submitted by the user, the product\u2019s information will be inserted into the database using PHP and MySQL.<\/p>\n<h2>Features of the PHP Shopping Cart System<\/h2>\n<ul>\n<li>Display products from the database (MySQL)<\/li>\n<li>Add products to the cart (PHP Sessions)<\/li>\n<li>Update product quantity in the cart (PHP Sessions)<\/li>\n<li>Remove products from the cart (PHP Sessions)<\/li>\n<li>View cart items with total price (Cart class)<\/li>\n<li>Checkout and place order (PHP + MySQL)<\/li>\n<\/ul>\n<h2>\ud83d\udcc1 Project Structure<\/h2>\n<p>Here is the project structure of the PHP shopping cart system:<\/p>\n<pre class=\"file-struc\">shopping_cart_system_with_php<span style=\"color:#794938\">\/<\/span>\r\n\u251c\u2500\u2500 index.php\r\n\u251c\u2500\u2500 product.php\r\n\u251c\u2500\u2500 cart.php\r\n\u251c\u2500\u2500 checkout.php\r\n\u251c\u2500\u2500 order_status.php\r\n\u251c\u2500\u2500 inc<span style=\"color:#794938\">\/<\/span>\r\n|   \u251c\u2500\u2500 config.php\r\n|   \u251c\u2500\u2500 db.php\r\n|   \u2514\u2500\u2500 cart.class.php\r\n\u251c\u2500\u2500 api<span style=\"color:#794938\">\/<\/span>\r\n|   \u251c\u2500\u2500 cart_action.php\r\n|   \u2514\u2500\u2500 order_submit.php\r\n\u2514\u2500\u2500 assets<span style=\"color:#794938\">\/<\/span>\r\n    \u251c\u2500\u2500 js<span style=\"color:#794938\">\/<\/span>\r\n    |   \u2514\u2500\u2500 cart.js\r\n    \u251c\u2500\u2500 css<span style=\"color:#794938\">\/<\/span>\r\n    |   \u251c\u2500\u2500 bootstrap.min.css\r\n    |   \u2514\u2500\u2500 style.css\r\n    \u2514\u2500\u2500 images<span style=\"color:#794938\">\/<\/span>\r\n        \u2514\u2500\u2500 product...images...\r\n<\/pre>\n<h2>Create Database and Tables<\/h2>\n<p>Before we start coding, we need to create a MySQL database and the required tables. Below is the SQL code to create the database and tables for our shopping cart system.<\/p>\n<p>Run the following SQL commands in your MySQL database management tool (like phpMyAdmin) to set up the database named <code>shopping_cart_db<\/code> (if you want to use existing database, you can skip this step):<\/p>\n<pre style=\"color: rgb(68, 68, 68);\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">CREATE<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">DATABASE<\/span> <span style=\"font-weight: 700;\">IF<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">EXISTS<\/span> shopping_cart_db <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">CHARACTER<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">SET<\/span> utf8mb4 <span class=\"hljs-keyword\" style=\"font-weight: 700;\">COLLATE<\/span> utf8mb4_general_ci;\r\n<span class=\"hljs-keyword\" style=\"font-weight: 700;\">USE<\/span> shopping_cart_db;<\/pre>\n<p>Run the following SQL commands to create the required tables:<\/p>\n<ul>\n<li><code>products<\/code>: Stores product information (name, price, image, description, etc.)\n<\/li>\n<li><code>orders<\/code>: Contains order details (customer information, total amount, etc.)<\/li>\n<li><code>order_items<\/code>: Stores product-wise purchase details (product ID, quantity, price, etc.)<\/li>\n<\/ul>\n<pre style=\"color: rgb(68, 68, 68);\"><span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">-- Products table<\/span>\r\n<span class=\"hljs-keyword\" style=\"font-weight: 700;\">CREATE<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">TABLE<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">IF<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">EXISTS<\/span> products (\r\n  <span class=\"hljs-keyword\" style=\"font-weight: 700;\">id<\/span> <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">INT<\/span> AUTO_INCREMENT PRIMARY <span class=\"hljs-keyword\" style=\"font-weight: 700;\">KEY<\/span>,\r\n  <span class=\"hljs-keyword\" style=\"font-weight: 700;\">name<\/span> <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">VARCHAR<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">255<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  description <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">TEXT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  price <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">DECIMAL<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">10<\/span>,<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">2<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">DEFAULT<\/span> <span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">0.00<\/span>,\r\n  image <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">VARCHAR<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">255<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">DEFAULT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  created_at <span class=\"hljs-keyword\" style=\"font-weight: 700;\">TIMESTAMP<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">DEFAULT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">CURRENT_TIMESTAMP<\/span>\r\n);\r\n\r\n<span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">-- Orders table<\/span>\r\n<span class=\"hljs-keyword\" style=\"font-weight: 700;\">CREATE<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">TABLE<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">IF<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">EXISTS<\/span> orders (\r\n  <span class=\"hljs-keyword\" style=\"font-weight: 700;\">id<\/span> <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">INT<\/span> AUTO_INCREMENT PRIMARY <span class=\"hljs-keyword\" style=\"font-weight: 700;\">KEY<\/span>,\r\n  first_name <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">VARCHAR<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">100<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  last_name <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">VARCHAR<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">100<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  email <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">VARCHAR<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">150<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  phone <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">VARCHAR<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">50<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">DEFAULT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  shipping_address <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">TEXT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  billing_address <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">TEXT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  total <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">DECIMAL<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">10<\/span>,<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">2<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  created_at <span class=\"hljs-keyword\" style=\"font-weight: 700;\">TIMESTAMP<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">DEFAULT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">CURRENT_TIMESTAMP<\/span>\r\n);\r\n\r\n<span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">-- Order items<\/span>\r\n<span class=\"hljs-keyword\" style=\"font-weight: 700;\">CREATE<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">TABLE<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">IF<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">EXISTS<\/span> order_items (\r\n  <span class=\"hljs-keyword\" style=\"font-weight: 700;\">id<\/span> <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">INT<\/span> AUTO_INCREMENT PRIMARY <span class=\"hljs-keyword\" style=\"font-weight: 700;\">KEY<\/span>,\r\n  order_id <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">INT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  product_id <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">INT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  <span class=\"hljs-keyword\" style=\"font-weight: 700;\">name<\/span> <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">VARCHAR<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">255<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  price <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">DECIMAL<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">10<\/span>,<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">2<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  quantity <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">INT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  subtotal <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">DECIMAL<\/span>(<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">10<\/span>,<span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">2<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">NOT<\/span> <span class=\"hljs-literal\" style=\"color: rgb(120, 169, 96);\">NULL<\/span>,\r\n  FOREIGN <span class=\"hljs-keyword\" style=\"font-weight: 700;\">KEY<\/span> (order_id) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">REFERENCES<\/span> orders(<span class=\"hljs-keyword\" style=\"font-weight: 700;\">id<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">ON<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">DELETE<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">CASCADE<\/span>,\r\n  FOREIGN <span class=\"hljs-keyword\" style=\"font-weight: 700;\">KEY<\/span> (product_id) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">REFERENCES<\/span> products(<span class=\"hljs-keyword\" style=\"font-weight: 700;\">id<\/span>) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">ON<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">DELETE<\/span> RESTRICT\r\n);<\/pre>\n<p>Let&#8217;s insert some sample products into the <code>products<\/code> table to test our shopping cart:<\/p>\n<pre style=\"color: rgb(68, 68, 68);\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">INSERT<\/span> <span class=\"hljs-keyword\" style=\"font-weight: 700;\">INTO<\/span> products (<span class=\"hljs-keyword\" style=\"font-weight: 700;\">name<\/span>, description, price, image) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">VALUES<\/span>\r\n(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Classic T-Shirt'<\/span>, <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Comfortable cotton t-shirt. Available in multiple sizes and colors.'<\/span>, <span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">19.99<\/span>, <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'assets\/images\/product1.jpg'<\/span>),\r\n(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Sneakers'<\/span>, <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Lightweight running sneakers with breathable mesh upper.'<\/span>, <span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">59.99<\/span>, <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'assets\/images\/product2.jpg'<\/span>),\r\n(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Coffee Mug'<\/span>, <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Ceramic mug with 350ml capacity. Dishwasher safe.'<\/span>, <span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">9.50<\/span>, <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'assets\/images\/product3.jpg'<\/span>);<\/pre>\n<h2>Configuration File (inc\/config.php)<\/h2>\n<p>Create a configuration file named <code>config.php<\/code> in the <code>inc<\/code> directory. This file will contain the database connection settings and other configurations.<\/p>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Database&nbsp;configuration&nbsp;-&nbsp;update&nbsp;with&nbsp;your&nbsp;local&nbsp;DB&nbsp;credentials <br \/><\/span><span style=\"color: #0000BB\">define<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'DB_HOST'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'localhost'<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">define<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'DB_USER'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'root'<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">define<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'DB_PASS'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">define<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'DB_NAME'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'shopping_cart_db'<\/span><span style=\"color: #007700\">); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;From&nbsp;email&nbsp;for&nbsp;notifications&nbsp;(update&nbsp;if&nbsp;needed) <br \/><\/span><span style=\"color: #0000BB\">define<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'FROM_EMAIL'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'no-reply@example.com'<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">?&gt;<\/span><\/pre>\n<h2>Database Connection (inc\/db.php)<\/h2>\n<p>Create a database connection file named <code>db.php<\/code> in the <code>inc<\/code> directory. This file will establish a connection to the MySQL database using the configuration settings defined in <code>config.php<\/code>.<\/p>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #007700\">require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/config.php'<\/span><span style=\"color: #007700\">; <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Function&nbsp;to&nbsp;get&nbsp;a&nbsp;mysqli&nbsp;database&nbsp;connection <br \/><\/span><span style=\"color: #007700\">function&nbsp;<\/span><span style=\"color: #0000BB\">get_db<\/span><span style=\"color: #007700\">() <br \/>{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;static&nbsp;<\/span><span style=\"color: #0000BB\">$mysqli&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">null<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(<\/span><span style=\"color: #0000BB\">$mysqli&nbsp;<\/span><span style=\"color: #007700\">===&nbsp;<\/span><span style=\"color: #0000BB\">null<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$mysqli&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">mysqli<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">DB_HOST<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">DB_USER<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">DB_PASS<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">DB_NAME<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(<\/span><span style=\"color: #0000BB\">$mysqli<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">connect_errno<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;die(<\/span><span style=\"color: #DD0000\">'Database&nbsp;connection&nbsp;failed:&nbsp;'&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #0000BB\">$mysqli<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">connect_error<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$mysqli<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">set_charset<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'utf8mb4'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">$mysqli<\/span><span style=\"color: #007700\">; <br \/>} <br \/> <br \/><\/span><span style=\"color: #0000BB\">?&gt;<\/span><\/pre>\n<h2>Building the Cart Class (inc\/cart.class.php)<\/h2>\n<p>Create a file named <code>cart.class.php<\/code> in the <code>inc<\/code> directory. This file will contain the <code>Cart<\/code> class that manages cart operations such as adding, updating, and removing items from the cart.<\/p>\n<p>This is the core engine of the shopping cart. The class uses <code>$_SESSION['cart']<\/code> to store:<\/p>\n<ul>\n<li>product IDs<\/li>\n<li>quantity<\/li>\n<li>price<\/li>\n<li>subtotal<\/li>\n<\/ul>\n<p>The Cart class includes methods like:<\/p>\n<ul>\n<li><b>add($product_id, $qty)<\/b>: Adds a new product to the cart or increments existing quantity.<\/li>\n<li><b>update($product_id, $qty)<\/b>: Updates quantity for a cart item.<\/li>\n<li><b>remove($product_id)<\/b>: Removes selected product from cart.<\/li>\n<li><b>items()<\/b>: Returns all cart items along with product data (fetched from DB).<\/li>\n<li><b>total()<\/b>: Calculates the total price of all items.<\/li>\n<li><b>count()<\/b>: Shows item count.<\/li>\n<li><b>clear()<\/b>: Empties the cart after order submission.<\/li>\n<\/ul>\n<p>This Cart library keeps the system clean and reusable.<\/p>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #007700\">require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/db.php'<\/span><span style=\"color: #007700\">; <br \/> <br \/>class&nbsp;<\/span><span style=\"color: #0000BB\">Cart <br \/><\/span><span style=\"color: #007700\">{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">__construct<\/span><span style=\"color: #007700\">() <br \/>&nbsp;&nbsp;&nbsp;&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(<\/span><span style=\"color: #0000BB\">session_status<\/span><span style=\"color: #007700\">()&nbsp;===&nbsp;<\/span><span style=\"color: #0000BB\">PHP_SESSION_NONE<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">session_start<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(!isset(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">]))&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;[]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">add<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$qty&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">1<\/span><span style=\"color: #007700\">) <br \/>&nbsp;&nbsp;&nbsp;&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$db&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">get_db<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$product_id&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;(int)<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$qty&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">max<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">1<\/span><span style=\"color: #007700\">,&nbsp;(int)<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">); <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Validate&nbsp;product&nbsp;exists <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$stmt&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">prepare<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'SELECT&nbsp;id&nbsp;FROM&nbsp;products&nbsp;WHERE&nbsp;id&nbsp;=&nbsp;?&nbsp;LIMIT&nbsp;1'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">bind_param<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'i'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">execute<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$res&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">get_result<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(<\/span><span style=\"color: #0000BB\">$res<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">num_rows&nbsp;<\/span><span style=\"color: #007700\">===&nbsp;<\/span><span style=\"color: #0000BB\">0<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">false<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(isset(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">][<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">]))&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">][<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">]&nbsp;+=&nbsp;<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">][<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">true<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">update<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">) <br \/>&nbsp;&nbsp;&nbsp;&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$product_id&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;(int)<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$qty&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;(int)<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(<\/span><span style=\"color: #0000BB\">$qty&nbsp;<\/span><span style=\"color: #007700\">&lt;=&nbsp;<\/span><span style=\"color: #0000BB\">0<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">remove<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(isset(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">][<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">]))&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">][<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">true<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">false<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">remove<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">) <br \/>&nbsp;&nbsp;&nbsp;&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$product_id&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;(int)<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(isset(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">][<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">]))&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;unset(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">][<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">]); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">true<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">false<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">items<\/span><span style=\"color: #007700\">() <br \/>&nbsp;&nbsp;&nbsp;&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$db&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">get_db<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$items&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;[]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(empty(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">]))&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">$items<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$ids&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">array_keys<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">]); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$placeholders&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">implode<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">','<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">array_fill<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">0<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">count<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$ids<\/span><span style=\"color: #007700\">),&nbsp;<\/span><span style=\"color: #DD0000\">'?'<\/span><span style=\"color: #007700\">)); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$types&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">str_repeat<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'i'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">count<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$ids<\/span><span style=\"color: #007700\">)); <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$sql&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #DD0000\">\"SELECT&nbsp;id,&nbsp;name,&nbsp;price,&nbsp;image,&nbsp;description&nbsp;FROM&nbsp;products&nbsp;WHERE&nbsp;id&nbsp;IN&nbsp;(<\/span><span style=\"color: #0000BB\">$placeholders<\/span><span style=\"color: #DD0000\">)\"<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$stmt&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">prepare<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$sql<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">bind_param<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$types<\/span><span style=\"color: #007700\">,&nbsp;...<\/span><span style=\"color: #0000BB\">$ids<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">execute<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$res&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">get_result<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;while&nbsp;(<\/span><span style=\"color: #0000BB\">$row&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$res<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">fetch_assoc<\/span><span style=\"color: #007700\">())&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$pid&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;(int)<\/span><span style=\"color: #0000BB\">$row<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$qty&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;isset(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">][<\/span><span style=\"color: #0000BB\">$pid<\/span><span style=\"color: #007700\">])&nbsp;?&nbsp;(int)<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">][<\/span><span style=\"color: #0000BB\">$pid<\/span><span style=\"color: #007700\">]&nbsp;:&nbsp;<\/span><span style=\"color: #0000BB\">0<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$row<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'quantity'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$row<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'subtotal'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$qty&nbsp;<\/span><span style=\"color: #007700\">*&nbsp;(float)<\/span><span style=\"color: #0000BB\">$row<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'price'<\/span><span style=\"color: #007700\">]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$items<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #0000BB\">$pid<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$row<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">$items<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">total<\/span><span style=\"color: #007700\">() <br \/>&nbsp;&nbsp;&nbsp;&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$total&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">0.0<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;foreach&nbsp;(<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">items<\/span><span style=\"color: #007700\">()&nbsp;as&nbsp;<\/span><span style=\"color: #0000BB\">$item<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$total&nbsp;<\/span><span style=\"color: #007700\">+=&nbsp;<\/span><span style=\"color: #0000BB\">$item<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'subtotal'<\/span><span style=\"color: #007700\">]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">$total<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">count<\/span><span style=\"color: #007700\">() <br \/>&nbsp;&nbsp;&nbsp;&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$count&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">0<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;foreach&nbsp;(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">]&nbsp;as&nbsp;<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$count&nbsp;<\/span><span style=\"color: #007700\">+=&nbsp;<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">$count<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">clear<\/span><span style=\"color: #007700\">() <br \/>&nbsp;&nbsp;&nbsp;&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cart'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;[]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>} <br \/><\/span><\/pre>\n<h2>Displaying Products (index.php)<\/h2>\n<p>Create an <code>index.php<\/code> file to display the products fetched from the database. This file will also include the &#8220;Add to Cart&#8221; functionality.<\/p>\n<p>This page loads the product list using a database query:<\/p>\n<ul>\n<li>Fetches all products from products table<\/li>\n<li>Displays product image, name, price<\/li>\n<li>Includes &#8220;Add to Cart&#8221; button connected to AJAX request \u2192 <code>\/api\/cart_action.php<\/code><\/li>\n<\/ul>\n<p>Typical UI features:<\/p>\n<ul>\n<li>Bootstrap-based grid<\/li>\n<li>&#8220;View Details&#8221; button linking to <code>product.php?id=ID<\/code><\/li>\n<\/ul>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Include&nbsp;configuration&nbsp;and&nbsp;necessary&nbsp;files <br \/><\/span><span style=\"color: #007700\">require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/inc\/db.php'<\/span><span style=\"color: #007700\">; <br \/>require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/inc\/cart.class.php'<\/span><span style=\"color: #007700\">; <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Initialize&nbsp;cart&nbsp;and&nbsp;database&nbsp;connection <br \/><\/span><span style=\"color: #0000BB\">$cart&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Cart<\/span><span style=\"color: #007700\">(); <br \/><\/span><span style=\"color: #0000BB\">$db&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">get_db<\/span><span style=\"color: #007700\">(); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Fetch&nbsp;products&nbsp;from&nbsp;the&nbsp;database <br \/><\/span><span style=\"color: #0000BB\">$res&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">query<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'SELECT&nbsp;id,&nbsp;name,&nbsp;price,&nbsp;image,&nbsp;description&nbsp;FROM&nbsp;products&nbsp;ORDER&nbsp;BY&nbsp;id&nbsp;DESC'<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n\r\n<span style=\"color: rgb(95, 94, 78);\"><span class=\"hljs-meta\" style=\"color: rgb(174, 115, 19);\">&lt;!doctype html&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">html<\/span> <span class=\"hljs-attr\">lang<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"en\"<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">head<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">meta<\/span> <span class=\"hljs-attr\">charset<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"utf-8\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">title<\/span>&gt;<\/span>Product List<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">title<\/span>&gt;<\/span>\r\n\r\n  <span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- Bootstrap library --&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">link<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"assets\/css\/bootstrap.min.css\"<\/span> <span class=\"hljs-attr\">rel<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"stylesheet\"<\/span>&gt;<\/span>\r\n  \r\n  <span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- Custom styles --&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">link<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"assets\/css\/style.css\"<\/span> <span class=\"hljs-attr\">rel<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"stylesheet\"<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">head<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">body<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">nav<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"navbar navbar-expand-lg navbar-light bg-white fixed-top shadow-sm\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"container\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"navbar-brand\"<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"#\"<\/span>&gt;<\/span>My Shop<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n      <span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- Cart button with item count --&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"cart.php\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"btn btn-outline-primary\"<\/span>&gt;<\/span>\r\n        Cart <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">span<\/span> <span class=\"hljs-attr\">id<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"cart-count\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"badge bg-primary\"<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">count<\/span><span style=\"color: #007700\">();&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">span<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">nav<\/span>&gt;<\/span>\r\n\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"container mt-4\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"row g-3\"<\/span>&gt;<\/span>\r\n&nbsp;&nbsp;&nbsp;&nbsp;<span style=\"color: #0000BB\">&lt;?php&nbsp; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Loop&nbsp;through&nbsp;products&nbsp;and&nbsp;display&nbsp;them <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #007700\">if(<\/span><span style=\"color: #0000BB\">$res<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">num_rows&nbsp;<\/span><span style=\"color: #007700\">&gt;&nbsp;<\/span><span style=\"color: #0000BB\">0<\/span><span style=\"color: #007700\">): <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;while(<\/span><span style=\"color: #0000BB\">$p&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$res<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">fetch_assoc<\/span><span style=\"color: #007700\">()): <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"col-sm-6 col-md-4\"<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"product-card\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"product.php?id=<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">img<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'image'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span> <span class=\"hljs-attr\">alt<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'name'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"product-image\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"card-body\"<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h5<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"product.php?id=<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'name'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h5<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"text-muted\"<\/span>&gt;<\/span>$<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'price'<\/span><span style=\"color: #007700\">],&nbsp;<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">substr<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'description'<\/span><span style=\"color: #007700\">],&nbsp;<\/span><span style=\"color: #0000BB\">0<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">80<\/span><span style=\"color: #007700\">));&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>...<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"d-flex gap-2\"<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">button<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"btn btn-primary btn-add-cart\"<\/span> <span class=\"hljs-attr\">data-product-id<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">i<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"fa fa-cart-plus\"<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">i<\/span>&gt;<\/span> Add to Cart<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">button<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n&nbsp;&nbsp;&nbsp;&nbsp;<span style=\"color: #0000BB\">&lt;?php <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #007700\">endwhile; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;else: <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;echo&nbsp;<\/span><span style=\"color: #DD0000\">\"&lt;p&gt;No&nbsp;products&nbsp;found.&lt;\/p&gt;\"<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;endif; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n\r\n<span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- JavaScript for cart functionality --&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">script<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"assets\/js\/cart.js\"<\/span>&gt;<\/span><span class=\"undefined\"><\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">script<\/span>&gt;<\/span>\r\n\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">body<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">html<\/span>&gt;<\/span><\/span>\r\n<\/pre>\n<h2>Product Details Page (product.php)<\/h2>\n<p>Create a <code>product.php<\/code> file to display detailed information about a specific product. This page will be accessed via a URL parameter (e.g., <code>product.php?id=1<\/code>).<\/p>\n<p>It reads the <code>id<\/code> from the query parameter and then fetches product details from the DB and renders them. This page shows:<\/p>\n<ul>\n<li>Product image<\/li>\n<li>Description<\/li>\n<li>Full specifications<\/li>\n<li>Price<\/li>\n<li>Quantity selector<\/li>\n<li>Add to cart button: The &#8220;Add to Cart&#8221; button sends an AJAX request \u2192 <code>\/api\/cart_action.php.<\/code><\/li>\n<\/ul>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Include&nbsp;configuration&nbsp;and&nbsp;necessary&nbsp;files <br \/><\/span><span style=\"color: #007700\">require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/inc\/db.php'<\/span><span style=\"color: #007700\">; <br \/>require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/inc\/cart.class.php'<\/span><span style=\"color: #007700\">; <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Initialize&nbsp;cart&nbsp;and&nbsp;database&nbsp;connection <br \/><\/span><span style=\"color: #0000BB\">$cart&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Cart<\/span><span style=\"color: #007700\">(); <br \/><\/span><span style=\"color: #0000BB\">$db&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">get_db<\/span><span style=\"color: #007700\">(); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Get&nbsp;product&nbsp;ID&nbsp;from&nbsp;query&nbsp;parameter <br \/><\/span><span style=\"color: #0000BB\">$id&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">filter_input<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">INPUT_GET<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">FILTER_VALIDATE_INT<\/span><span style=\"color: #007700\">); <br \/>if&nbsp;(!<\/span><span style=\"color: #0000BB\">$id<\/span><span style=\"color: #007700\">)&nbsp;die(<\/span><span style=\"color: #DD0000\">'Product&nbsp;not&nbsp;found'<\/span><span style=\"color: #007700\">); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Fetch&nbsp;product&nbsp;details&nbsp;from&nbsp;the&nbsp;database <br \/><\/span><span style=\"color: #0000BB\">$stmt&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">prepare<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'SELECT&nbsp;id,&nbsp;name,&nbsp;description,&nbsp;price,&nbsp;image&nbsp;FROM&nbsp;products&nbsp;WHERE&nbsp;id&nbsp;=&nbsp;?&nbsp;LIMIT&nbsp;1'<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">bind_param<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'i'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$id<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">execute<\/span><span style=\"color: #007700\">(); <br \/><\/span><span style=\"color: #0000BB\">$res&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">get_result<\/span><span style=\"color: #007700\">(); <br \/>if&nbsp;(<\/span><span style=\"color: #0000BB\">$res<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">num_rows&nbsp;<\/span><span style=\"color: #007700\">===&nbsp;<\/span><span style=\"color: #0000BB\">0<\/span><span style=\"color: #007700\">)&nbsp;die(<\/span><span style=\"color: #DD0000\">'Product&nbsp;not&nbsp;found'<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$p&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$res<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">fetch_assoc<\/span><span style=\"color: #007700\">(); <br \/><\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n\r\n<span style=\"color: rgb(95, 94, 78);\"><span class=\"hljs-meta\" style=\"color: rgb(174, 115, 19);\">&lt;!doctype html&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">html<\/span> <span class=\"hljs-attr\">lang<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"en\"<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">head<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">meta<\/span> <span class=\"hljs-attr\">charset<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"utf-8\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">title<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'name'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">title<\/span>&gt;<\/span>\r\n  \r\n  <span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- Bootstrap library --&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">link<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"assets\/css\/bootstrap.min.css\"<\/span> <span class=\"hljs-attr\">rel<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"stylesheet\"<\/span>&gt;<\/span>\r\n\r\n  <span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- Custom styles --&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">link<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"assets\/css\/style.css\"<\/span> <span class=\"hljs-attr\">rel<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"stylesheet\"<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">head<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">body<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">nav<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"navbar navbar-expand-lg navbar-light bg-white fixed-top shadow-sm\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"container\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"navbar-brand\"<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"index.php\"<\/span>&gt;<\/span>My Shop<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n      <span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- Cart button with item count --&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"cart.php\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"btn btn-outline-primary\"<\/span>&gt;<\/span>\r\n        Cart <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">span<\/span> <span class=\"hljs-attr\">id<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"cart-count\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"badge bg-primary\"<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">count<\/span><span style=\"color: #007700\">();&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">span<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">nav<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"row\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"col-md-6\"<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">img<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'image'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"img-fluid\"<\/span> <span class=\"hljs-attr\">alt<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'name'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"col-md-6\"<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h2<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'name'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h2<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"text-muted\"<\/span>&gt;<\/span>$<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'price'<\/span><span style=\"color: #007700\">],&nbsp;<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">nl2br<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'description'<\/span><span style=\"color: #007700\">]));&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"d-flex gap-2 align-items-center\"<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">input<\/span> <span class=\"hljs-attr\">type<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"number\"<\/span> <span class=\"hljs-attr\">id<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"qty-<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span> <span class=\"hljs-attr\">min<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"1\"<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"1\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"form-control\"<\/span> <span class=\"hljs-attr\">style<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"width:100px\"<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">button<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"btn btn-success btn-add-cart\"<\/span> <span class=\"hljs-attr\">data-product-id<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$p<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>Add to Cart<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">button<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n\r\n<span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- JavaScript for cart functionality --&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">script<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"assets\/js\/cart.js\"<\/span>&gt;<\/span><span class=\"undefined\"><\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">script<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">body<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">html<\/span>&gt;<\/span><\/span>\r\n<\/pre>\n<h2>Shopping Cart Page (cart.php)<\/h2>\n<p>The cart page (<code>cart.php<\/code>) displays all items added to the cart, allowing users to update quantities or remove items. It also shows the total price and a checkout button.<\/p>\n<ul>\n<li>At the top, it initializes the Cart class and retrieves cart items from the session.<\/li>\n<li>It then loops through the cart items, fetching product details from the database for each item.<\/li>\n<li>The page displays each item&#8217;s name, price, quantity (with an input field to update), and subtotal. It also calculates and displays the total price for all items in the cart.<\/li>\n<li>Finally, it includes JavaScript to handle quantity updates and item removals via AJAX (request \u2192 <code>\/api\/cart_action.php<\/code>).<\/li>\n<\/ul>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Include&nbsp;library&nbsp;and&nbsp;initialize&nbsp;cart <br \/><\/span><span style=\"color: #007700\">require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/inc\/cart.class.php'<\/span><span style=\"color: #007700\">; <br \/><\/span><span style=\"color: #0000BB\">$cart&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Cart<\/span><span style=\"color: #007700\">(); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Retrieve&nbsp;cart&nbsp;items&nbsp;from&nbsp;session <br \/><\/span><span style=\"color: #0000BB\">$items&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">items<\/span><span style=\"color: #007700\">(); <br \/><\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"container mt-4\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- Display cart items or empty message --&gt;<\/span>\r\n  <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">if&nbsp;(empty(<\/span><span style=\"color: #0000BB\">$items<\/span><span style=\"color: #007700\">)):&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"alert alert-info\"<\/span>&gt;<\/span>Your cart is empty. <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"index.php\"<\/span>&gt;<\/span>Continue shopping<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span>&gt;<\/span>.<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n  <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">else:&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"table-responsive\"<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">table<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"table align-middle\"<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">thead<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tr<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span> <span class=\"hljs-attr\">width<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"43%\"<\/span>&gt;<\/span>Product<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span> <span class=\"hljs-attr\">width<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"15%\"<\/span>&gt;<\/span>Price<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span> <span class=\"hljs-attr\">width<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"15%\"<\/span>&gt;<\/span>Quantity<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span> <span class=\"hljs-attr\">width<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"20%\"<\/span>&gt;<\/span>Subtotal<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span> <span class=\"hljs-attr\">width<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"7%\"<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">th<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tr<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">thead<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tbody<\/span>&gt;<\/span>\r\n          <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">foreach&nbsp;(<\/span><span style=\"color: #0000BB\">$items&nbsp;<\/span><span style=\"color: #007700\">as&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">):&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tr<\/span> <span class=\"hljs-attr\">data-id<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n                <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"d-flex align-items-center\"<\/span>&gt;<\/span>\r\n                  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">img<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'image'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"img-thumb me-2\"<\/span> <span class=\"hljs-attr\">alt<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"\"<\/span>&gt;<\/span>\r\n                  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n                    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"product.php?id=<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'name'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">a<\/span>&gt;<\/span>\r\n                  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n                <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>$<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'price'<\/span><span style=\"color: #007700\">],<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n                <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">input<\/span> <span class=\"hljs-attr\">type<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"number\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"form-control qty-input\"<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'quantity'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span> <span class=\"hljs-attr\">min<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"1\"<\/span> <span class=\"hljs-attr\">data-id<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"subtotal\"<\/span>&gt;<\/span>$<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'subtotal'<\/span><span style=\"color: #007700\">],<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n                <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">button<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"btn btn-danger btn-remove\"<\/span> <span class=\"hljs-attr\">data-id<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">i<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"fa fa-trash\"<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">i<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">button<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tr<\/span>&gt;<\/span>\r\n          <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">endforeach;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tbody<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tfoot<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tr<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span> <span class=\"hljs-attr\">colspan<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"3\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"text-end\"<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">strong<\/span>&gt;<\/span>Total<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">strong<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span> <span class=\"hljs-attr\">colspan<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"2\"<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">strong<\/span>&gt;<\/span>$<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">total<\/span><span style=\"color: #007700\">(),<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">strong<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">td<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tr<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">tfoot<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">table<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n  <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">endif;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">script<\/span>&gt;<\/span>\r\n<span style=\"color: rgb(68, 68, 68);\"><span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">\/\/ Small AJAX handlers using fetch<\/span>\r\n<span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span> <span class=\"hljs-title\" style=\"color: rgb(136, 0, 0); font-weight: 700;\">postForm<\/span>(<span class=\"hljs-params\">data<\/span>) <\/span>{\r\n  <span class=\"hljs-keyword\" style=\"font-weight: 700;\">return<\/span> fetch(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'api\/cart_action.php'<\/span>, { method: <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'POST'<\/span>, body: data }).then(r =&gt; r.json());\r\n}\r\n\r\n<span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">\/\/ Handle quantity changes and item removals<\/span>\r\n<span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">document<\/span>.addEventListener(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'DOMContentLoaded'<\/span>, <span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span>(<span class=\"hljs-params\"><\/span>)<\/span>{\r\n  <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">document<\/span>.querySelectorAll(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'.qty-input'<\/span>).forEach(<span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span>(<span class=\"hljs-params\">el<\/span>)<\/span>{\r\n    el.addEventListener(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'change'<\/span>, <span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span>(<span class=\"hljs-params\"><\/span>)<\/span>{\r\n      <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> id = <span class=\"hljs-keyword\" style=\"font-weight: 700;\">this<\/span>.dataset.id;\r\n      <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> qty = <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">parseInt<\/span>(<span class=\"hljs-keyword\" style=\"font-weight: 700;\">this<\/span>.value) || <span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">1<\/span>;\r\n      <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> fd = <span class=\"hljs-keyword\" style=\"font-weight: 700;\">new<\/span> FormData(); fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'action'<\/span>,<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'update'<\/span>); fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'product_id'<\/span>, id); fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'quantity'<\/span>, qty);\r\n      postForm(fd).then(resp =&gt; {\r\n        <span class=\"hljs-keyword\" style=\"font-weight: 700;\">if<\/span> (resp.success) location.reload(); <span class=\"hljs-keyword\" style=\"font-weight: 700;\">else<\/span> alert(resp.message || <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Update failed'<\/span>);\r\n      });\r\n    });\r\n  });\r\n\r\n  <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">document<\/span>.querySelectorAll(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'.btn-remove'<\/span>).forEach(<span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span>(<span class=\"hljs-params\">btn<\/span>)<\/span>{\r\n    btn.addEventListener(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'click'<\/span>, <span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span>(<span class=\"hljs-params\"><\/span>)<\/span>{\r\n      <span class=\"hljs-keyword\" style=\"font-weight: 700;\">if<\/span> (!confirm(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Remove this item?'<\/span>)) <span class=\"hljs-keyword\" style=\"font-weight: 700;\">return<\/span>;\r\n      <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> id = <span class=\"hljs-keyword\" style=\"font-weight: 700;\">this<\/span>.dataset.id;\r\n      <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> fd = <span class=\"hljs-keyword\" style=\"font-weight: 700;\">new<\/span> FormData(); fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'action'<\/span>,<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'remove'<\/span>); fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'product_id'<\/span>, id);\r\n      postForm(fd).then(resp =&gt; { <span class=\"hljs-keyword\" style=\"font-weight: 700;\">if<\/span> (resp.success) location.reload(); <span class=\"hljs-keyword\" style=\"font-weight: 700;\">else<\/span> alert(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Failed'<\/span>); });\r\n    });\r\n  });\r\n});<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">script<\/span>&gt;<\/span>\r\n<\/pre>\n<h2>AJAX Cart Operations (api\/cart_action.php)<\/h2>\n<p>Create a file named <code>cart_action.php<\/code> in the <code>api<\/code> directory. This script handles AJAX requests to add, update, or remove items from the shopping cart. It expects POST requests with an <code>action<\/code> parameter and relevant data.<\/p>\n<ul>\n<li><strong>Include Cart Class:<\/strong> The script includes the cart class and initializes a cart object.<\/li>\n<li><strong>Set Response Header:<\/strong> It sets the response header to indicate that the response will be in JSON format.<\/li>\n<li><strong>Get Action:<\/strong> The action to be performed (add, update, remove) is retrieved from the POST data.<\/li>\n<li><strong>Handle Actions:<\/strong> Based on the action, the script performs the corresponding cart operation:\n<ul>\n<li><em>Add:<\/em> Validates product ID and quantity, adds the item to the cart, and returns a success message.<\/li>\n<li><em>Update:<\/em> Validates product ID and quantity, updates the item quantity in the cart, and returns a success message.<\/li>\n<li><em>Remove:<\/em> Validates product ID, removes the item from the cart, and returns a success message.<\/li>\n<\/ul>\n<\/li>\n<li><strong>Error Handling:<\/strong> If any validation fails or an exception occurs, an error message is returned in the JSON response.<\/li>\n<\/ul>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Include&nbsp;cart&nbsp;class&nbsp;and&nbsp;initialize&nbsp;cart <br \/><\/span><span style=\"color: #007700\">require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/..\/inc\/cart.class.php'<\/span><span style=\"color: #007700\">; <br \/><\/span><span style=\"color: #0000BB\">$cart&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Cart<\/span><span style=\"color: #007700\">(); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Set&nbsp;response&nbsp;header&nbsp;for&nbsp;JSON <br \/><\/span><span style=\"color: #0000BB\">header<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'Content-Type:&nbsp;application\/json;&nbsp;charset=utf-8'<\/span><span style=\"color: #007700\">); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Get&nbsp;action&nbsp;from&nbsp;POST&nbsp;data <br \/><\/span><span style=\"color: #0000BB\">$action&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$_POST<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'action'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">; <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Handle&nbsp;different&nbsp;cart&nbsp;actions&nbsp;(add,&nbsp;update,&nbsp;remove) <br \/><\/span><span style=\"color: #007700\">try&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Add&nbsp;item&nbsp;to&nbsp;cart <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #007700\">if&nbsp;(<\/span><span style=\"color: #0000BB\">$action&nbsp;<\/span><span style=\"color: #007700\">===&nbsp;<\/span><span style=\"color: #DD0000\">'add'<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$product_id&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">filter_input<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">INPUT_POST<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'product_id'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">FILTER_VALIDATE_INT<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$qty&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">filter_input<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">INPUT_POST<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'quantity'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">FILTER_VALIDATE_INT<\/span><span style=\"color: #007700\">)&nbsp;?:&nbsp;<\/span><span style=\"color: #0000BB\">1<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(!<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">)&nbsp;throw&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Exception<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'Invalid&nbsp;product&nbsp;id'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$ok&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">add<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(!<\/span><span style=\"color: #0000BB\">$ok<\/span><span style=\"color: #007700\">)&nbsp;throw&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Exception<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'Product&nbsp;not&nbsp;found'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;echo&nbsp;<\/span><span style=\"color: #0000BB\">json_encode<\/span><span style=\"color: #007700\">([<\/span><span style=\"color: #DD0000\">'success'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">true<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'count'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">count<\/span><span style=\"color: #007700\">()]); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;exit; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Update&nbsp;item&nbsp;quantity&nbsp;in&nbsp;cart <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #007700\">if&nbsp;(<\/span><span style=\"color: #0000BB\">$action&nbsp;<\/span><span style=\"color: #007700\">===&nbsp;<\/span><span style=\"color: #DD0000\">'update'<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$product_id&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">filter_input<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">INPUT_POST<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'product_id'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">FILTER_VALIDATE_INT<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$qty&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">filter_input<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">INPUT_POST<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'quantity'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">FILTER_VALIDATE_INT<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(!<\/span><span style=\"color: #0000BB\">$product_id&nbsp;<\/span><span style=\"color: #007700\">||&nbsp;<\/span><span style=\"color: #0000BB\">$qty&nbsp;<\/span><span style=\"color: #007700\">===&nbsp;<\/span><span style=\"color: #0000BB\">null<\/span><span style=\"color: #007700\">)&nbsp;throw&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Exception<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'Invalid&nbsp;input'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$ok&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">update<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$qty<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;echo&nbsp;<\/span><span style=\"color: #0000BB\">json_encode<\/span><span style=\"color: #007700\">([<\/span><span style=\"color: #DD0000\">'success'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">$ok<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'total'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">total<\/span><span style=\"color: #007700\">()]); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;exit; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Remove&nbsp;item&nbsp;from&nbsp;cart <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #007700\">if&nbsp;(<\/span><span style=\"color: #0000BB\">$action&nbsp;<\/span><span style=\"color: #007700\">===&nbsp;<\/span><span style=\"color: #DD0000\">'remove'<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$product_id&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">filter_input<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">INPUT_POST<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'product_id'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">FILTER_VALIDATE_INT<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(!<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">)&nbsp;throw&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Exception<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'Invalid&nbsp;product&nbsp;id'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$ok&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">remove<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$product_id<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;echo&nbsp;<\/span><span style=\"color: #0000BB\">json_encode<\/span><span style=\"color: #007700\">([<\/span><span style=\"color: #DD0000\">'success'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">$ok<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'total'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">total<\/span><span style=\"color: #007700\">(),&nbsp;<\/span><span style=\"color: #DD0000\">'count'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">count<\/span><span style=\"color: #007700\">()]); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;exit; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;echo&nbsp;<\/span><span style=\"color: #0000BB\">json_encode<\/span><span style=\"color: #007700\">([<\/span><span style=\"color: #DD0000\">'success'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">false<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'message'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #DD0000\">'Unknown&nbsp;action'<\/span><span style=\"color: #007700\">]); <br \/>}&nbsp;catch&nbsp;(<\/span><span style=\"color: #0000BB\">Exception&nbsp;$e<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;echo&nbsp;<\/span><span style=\"color: #0000BB\">json_encode<\/span><span style=\"color: #007700\">([<\/span><span style=\"color: #DD0000\">'success'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">false<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'message'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">$e<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">getMessage<\/span><span style=\"color: #007700\">()]); <br \/>} <br \/><\/span><\/pre>\n<h2>Checkout Page (checkout.php)<\/h2>\n<p>This page displays the checkout form and processes user input for completing the purchase. It retrieves cart items from the session and handles validation errors and old inputs.<\/p>\n<ul>\n<li><strong>Session Management:<\/strong> The script ensures that a session is started to access validation errors and old input data.<\/li>\n<li><strong>Include Cart Class:<\/strong> It includes the cart class and initializes a cart object.<\/li>\n<li><strong>Retrieve Cart Items:<\/strong> The cart items are retrieved from the session. If the cart is empty, the user is redirected to the index page.<\/li>\n<li><strong>Validation Errors and Old Inputs:<\/strong> Any validation errors and old input values from a previous submission are retrieved from the session and then cleared.<\/li>\n<\/ul>\n<p>The form submits order details via AJAX to <code>api\/order_submit.php<\/code>.<\/p>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;ensure&nbsp;session&nbsp;available&nbsp;for&nbsp;validation&nbsp;errors&nbsp;\/&nbsp;old&nbsp;inputs <br \/><\/span><span style=\"color: #007700\">if&nbsp;(<\/span><span style=\"color: #0000BB\">session_status<\/span><span style=\"color: #007700\">()&nbsp;===&nbsp;<\/span><span style=\"color: #0000BB\">PHP_SESSION_NONE<\/span><span style=\"color: #007700\">)&nbsp;<\/span><span style=\"color: #0000BB\">session_start<\/span><span style=\"color: #007700\">(); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Include&nbsp;library&nbsp;and&nbsp;initialize&nbsp;cart <br \/><\/span><span style=\"color: #007700\">require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/inc\/cart.class.php'<\/span><span style=\"color: #007700\">; <br \/><\/span><span style=\"color: #0000BB\">$cart&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Cart<\/span><span style=\"color: #007700\">(); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Retrieve&nbsp;cart&nbsp;items&nbsp;from&nbsp;session <br \/><\/span><span style=\"color: #0000BB\">$items&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">items<\/span><span style=\"color: #007700\">(); <br \/>if&nbsp;(empty(<\/span><span style=\"color: #0000BB\">$items<\/span><span style=\"color: #007700\">))&nbsp;{ <br \/>&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">header<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'Location:&nbsp;index.php'<\/span><span style=\"color: #007700\">);&nbsp;exit; <br \/>} <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;grab&nbsp;validation&nbsp;errors&nbsp;and&nbsp;old&nbsp;inputs&nbsp;from&nbsp;session&nbsp;(if&nbsp;any) <br \/><\/span><span style=\"color: #0000BB\">$errors&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'checkout_errors'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;[]; <br \/><\/span><span style=\"color: #0000BB\">$old&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'checkout_old'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;[]; <br \/>unset(<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'checkout_errors'<\/span><span style=\"color: #007700\">],&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'checkout_old'<\/span><span style=\"color: #007700\">]); <br \/><\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"container mt-4\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"row\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"col-md-7\"<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h3<\/span>&gt;<\/span>Buyer Information<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h3<\/span>&gt;<\/span>\r\n\r\n      <span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- Display validation errors if any --&gt;<\/span>\r\n      <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">if&nbsp;(!empty(<\/span><span style=\"color: #0000BB\">$errors<\/span><span style=\"color: #007700\">)):&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"alert alert-danger\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">ul<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"mb-0\"<\/span>&gt;<\/span>\r\n            <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">foreach&nbsp;(<\/span><span style=\"color: #0000BB\">$errors&nbsp;<\/span><span style=\"color: #007700\">as&nbsp;<\/span><span style=\"color: #0000BB\">$err<\/span><span style=\"color: #007700\">):&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">li<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$err<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">li<\/span>&gt;<\/span>\r\n            <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">endforeach;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">ul<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n      <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">endif;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n\r\n      <span class=\"hljs-comment\" style=\"color: rgb(108, 107, 90);\">&lt;!-- Checkout form --&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">form<\/span> <span class=\"hljs-attr\">method<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"post\"<\/span> <span class=\"hljs-attr\">action<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"api\/order_submit.php\"<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"row\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"col-md-6 mb-3\"<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">input<\/span> <span class=\"hljs-attr\">name<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"first_name\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"form-control\"<\/span> <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"First name\"<\/span> <span class=\"hljs-attr\">required<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$old<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'first_name'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"col-md-6 mb-3\"<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">input<\/span> <span class=\"hljs-attr\">name<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"last_name\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"form-control\"<\/span> <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"Last name\"<\/span> <span class=\"hljs-attr\">required<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$old<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'last_name'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"mb-3\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">input<\/span> <span class=\"hljs-attr\">name<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"email\"<\/span> <span class=\"hljs-attr\">type<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"email\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"form-control\"<\/span> <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"Email\"<\/span> <span class=\"hljs-attr\">required<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$old<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'email'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"mb-3\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">input<\/span> <span class=\"hljs-attr\">name<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"phone\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"form-control\"<\/span> <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"Phone\"<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$old<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'phone'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"mb-3\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">textarea<\/span> <span class=\"hljs-attr\">name<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"shipping_address\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"form-control\"<\/span> <span class=\"hljs-attr\">rows<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"3\"<\/span> <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"Shipping address\"<\/span> <span class=\"hljs-attr\">required<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$old<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'shipping_address'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">textarea<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"mb-3\"<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">textarea<\/span> <span class=\"hljs-attr\">name<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"billing_address\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"form-control\"<\/span> <span class=\"hljs-attr\">rows<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"3\"<\/span> <span class=\"hljs-attr\">placeholder<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"Billing address\"<\/span> <span class=\"hljs-attr\">required<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$old<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'billing_address'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">textarea<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">button<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"btn btn-success\"<\/span> <span class=\"hljs-attr\">type<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"submit\"<\/span>&gt;<\/span>Place Order<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">button<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">form<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"col-md-5\"<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h4<\/span>&gt;<\/span>Cart Summary <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">small<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"text-muted\"<\/span>&gt;<\/span>(<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">count<\/span><span style=\"color: #007700\">();&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span> items)<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">small<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h4<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"cart-summary\"<\/span>&gt;<\/span>\r\n        <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">foreach&nbsp;(<\/span><span style=\"color: #0000BB\">$items&nbsp;<\/span><span style=\"color: #007700\">as&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">):&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"d-flex align-items-center mb-3\"<\/span> <span class=\"hljs-attr\">data-id<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">img<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'image'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"img-thumb me-3\"<\/span> <span class=\"hljs-attr\">alt<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"\"<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"flex-grow-1\"<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"fw-semibold\"<\/span>&gt;<\/span><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'name'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n              <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"text-muted small\"<\/span>&gt;<\/span>Price: $<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'price'<\/span><span style=\"color: #007700\">],<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span> &amp;nbsp;\u2022&amp;nbsp; Qty: <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'quantity'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span> &amp;nbsp;\u2022&amp;nbsp; Subtotal: $<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'subtotal'<\/span><span style=\"color: #007700\">],<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n            <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n          <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n        <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">endforeach;&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">hr<\/span>&gt;<\/span>\r\n        <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"d-flex justify-content-between mb-2\"<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">strong<\/span>&gt;<\/span>Total<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">strong<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">strong<\/span>&gt;<\/span>$<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">total<\/span><span style=\"color: #007700\">(),<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">strong<\/span>&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>   \r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n<\/pre>\n<h2>Order Submission (api\/order_submit.php)<\/h2>\n<p>Create a file named <code>order_submit.php<\/code> in the <code>api<\/code> directory. This script processes the order submission. It includes server-side validation, cart retrieval, and order storage in the database.<\/p>\n<ul>\n<li>Includes necessary files for cart management, database connection, and configuration.<\/li>\n<li>Starts a session to store errors and old input data.<\/li>\n<li>Initializes the cart and retrieves cart items. If the cart is empty, it sets an error message and redirects back to the checkout page.<\/li>\n<li>Performs basic server-side validation and sanitization of user input (first name, last name, email, phone, shipping address, billing address).<\/li>\n<li>Insert order and order items into the database (MySQLi prepared statements).<\/li>\n<li>Sends order confirmation email to the user using PHP&#8217;s mail function.<\/li>\n<li>Clears the cart upon successful order placement and redirects to an order status page (<code>order_status.php?order_id={$order_id}<\/code>).<\/li>\n<\/ul>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Include&nbsp;necessary&nbsp;files <br \/><\/span><span style=\"color: #007700\">require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/..\/inc\/cart.class.php'<\/span><span style=\"color: #007700\">; <br \/>require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/..\/inc\/db.php'<\/span><span style=\"color: #007700\">; <br \/>require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/..\/inc\/config.php'<\/span><span style=\"color: #007700\">; <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Start&nbsp;session&nbsp;to&nbsp;store&nbsp;errors&nbsp;and&nbsp;old&nbsp;input <br \/><\/span><span style=\"color: #007700\">if&nbsp;(<\/span><span style=\"color: #0000BB\">session_status<\/span><span style=\"color: #007700\">()&nbsp;===&nbsp;<\/span><span style=\"color: #0000BB\">PHP_SESSION_NONE<\/span><span style=\"color: #007700\">)&nbsp;<\/span><span style=\"color: #0000BB\">session_start<\/span><span style=\"color: #007700\">(); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Initialize&nbsp;cart&nbsp; <br \/><\/span><span style=\"color: #0000BB\">$cart&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Cart<\/span><span style=\"color: #007700\">(); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Retrieve&nbsp;cart&nbsp;items <br \/><\/span><span style=\"color: #0000BB\">$items&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">items<\/span><span style=\"color: #007700\">(); <br \/>if&nbsp;(empty(<\/span><span style=\"color: #0000BB\">$items<\/span><span style=\"color: #007700\">))&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;set&nbsp;an&nbsp;error&nbsp;and&nbsp;redirect&nbsp;back&nbsp;to&nbsp;checkout&nbsp;(or&nbsp;index) <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'checkout_errors'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;[<\/span><span style=\"color: #DD0000\">'Your&nbsp;cart&nbsp;is&nbsp;empty.'<\/span><span style=\"color: #007700\">]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">header<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'Location:&nbsp;..\/checkout.php'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;exit; <br \/>} <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Basic&nbsp;server-side&nbsp;validation&nbsp;and&nbsp;sanitization <br \/><\/span><span style=\"color: #0000BB\">$first_name&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">trim<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$_POST<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'first_name'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$last_name&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">trim<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$_POST<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'last_name'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$email&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">filter_var<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$_POST<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'email'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">FILTER_VALIDATE_EMAIL<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$phone&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">trim<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$_POST<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'phone'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$shipping&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">trim<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$_POST<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'shipping_address'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$billing&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">trim<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$_POST<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'billing_address'<\/span><span style=\"color: #007700\">]&nbsp;??&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">); <br \/> <br \/><\/span><span style=\"color: #0000BB\">$errors&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;[]; <br \/>if&nbsp;(!<\/span><span style=\"color: #0000BB\">$first_name<\/span><span style=\"color: #007700\">)&nbsp;<\/span><span style=\"color: #0000BB\">$errors<\/span><span style=\"color: #007700\">[]&nbsp;=&nbsp;<\/span><span style=\"color: #DD0000\">'First&nbsp;name&nbsp;is&nbsp;required'<\/span><span style=\"color: #007700\">; <br \/>if&nbsp;(!<\/span><span style=\"color: #0000BB\">$last_name<\/span><span style=\"color: #007700\">)&nbsp;<\/span><span style=\"color: #0000BB\">$errors<\/span><span style=\"color: #007700\">[]&nbsp;=&nbsp;<\/span><span style=\"color: #DD0000\">'Last&nbsp;name&nbsp;is&nbsp;required'<\/span><span style=\"color: #007700\">; <br \/>if&nbsp;(!<\/span><span style=\"color: #0000BB\">$email<\/span><span style=\"color: #007700\">)&nbsp;<\/span><span style=\"color: #0000BB\">$errors<\/span><span style=\"color: #007700\">[]&nbsp;=&nbsp;<\/span><span style=\"color: #DD0000\">'Valid&nbsp;email&nbsp;is&nbsp;required'<\/span><span style=\"color: #007700\">; <br \/>if&nbsp;(!<\/span><span style=\"color: #0000BB\">$shipping<\/span><span style=\"color: #007700\">)&nbsp;<\/span><span style=\"color: #0000BB\">$errors<\/span><span style=\"color: #007700\">[]&nbsp;=&nbsp;<\/span><span style=\"color: #DD0000\">'Shipping&nbsp;address&nbsp;is&nbsp;required'<\/span><span style=\"color: #007700\">; <br \/>if&nbsp;(!<\/span><span style=\"color: #0000BB\">$billing<\/span><span style=\"color: #007700\">)&nbsp;<\/span><span style=\"color: #0000BB\">$errors<\/span><span style=\"color: #007700\">[]&nbsp;=&nbsp;<\/span><span style=\"color: #DD0000\">'Billing&nbsp;address&nbsp;is&nbsp;required'<\/span><span style=\"color: #007700\">; <br \/> <br \/>if&nbsp;(!empty(<\/span><span style=\"color: #0000BB\">$errors<\/span><span style=\"color: #007700\">))&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;store&nbsp;errors&nbsp;and&nbsp;old&nbsp;input&nbsp;in&nbsp;session&nbsp;then&nbsp;redirect&nbsp;back&nbsp;to&nbsp;checkout <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'checkout_errors'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$errors<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$_SESSION<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'checkout_old'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;[ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #DD0000\">'first_name'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$first_name<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">ENT_QUOTES&nbsp;<\/span><span style=\"color: #007700\">|&nbsp;<\/span><span style=\"color: #0000BB\">ENT_SUBSTITUTE<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'UTF-8'<\/span><span style=\"color: #007700\">), <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #DD0000\">'last_name'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$last_name<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">ENT_QUOTES&nbsp;<\/span><span style=\"color: #007700\">|&nbsp;<\/span><span style=\"color: #0000BB\">ENT_SUBSTITUTE<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'UTF-8'<\/span><span style=\"color: #007700\">), <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #DD0000\">'email'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">$email&nbsp;<\/span><span style=\"color: #007700\">?:&nbsp;<\/span><span style=\"color: #DD0000\">''<\/span><span style=\"color: #007700\">, <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #DD0000\">'phone'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$phone<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">ENT_QUOTES&nbsp;<\/span><span style=\"color: #007700\">|&nbsp;<\/span><span style=\"color: #0000BB\">ENT_SUBSTITUTE<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'UTF-8'<\/span><span style=\"color: #007700\">), <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #DD0000\">'shipping_address'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$shipping<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">ENT_QUOTES&nbsp;<\/span><span style=\"color: #007700\">|&nbsp;<\/span><span style=\"color: #0000BB\">ENT_SUBSTITUTE<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'UTF-8'<\/span><span style=\"color: #007700\">), <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #DD0000\">'billing_address'&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$billing<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">ENT_QUOTES&nbsp;<\/span><span style=\"color: #007700\">|&nbsp;<\/span><span style=\"color: #0000BB\">ENT_SUBSTITUTE<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'UTF-8'<\/span><span style=\"color: #007700\">), <br \/>&nbsp;&nbsp;&nbsp;&nbsp;]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">header<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'Location:&nbsp;..\/checkout.php'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;exit; <br \/>} <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Insert&nbsp;order&nbsp;and&nbsp;order&nbsp;items&nbsp;into&nbsp;database <br \/><\/span><span style=\"color: #0000BB\">$db&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">get_db<\/span><span style=\"color: #007700\">(); <br \/><\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">begin_transaction<\/span><span style=\"color: #007700\">(); <br \/>try&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$total&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">total<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$stmt&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">prepare<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'INSERT&nbsp;INTO&nbsp;orders&nbsp;(first_name,&nbsp;last_name,&nbsp;email,&nbsp;phone,&nbsp;shipping_address,&nbsp;billing_address,&nbsp;total)&nbsp;VALUES&nbsp;(?,&nbsp;?,&nbsp;?,&nbsp;?,&nbsp;?,&nbsp;?,&nbsp;?)'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">bind_param<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'ssssssd'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$first_name<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$last_name<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$email<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$phone<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$shipping<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$billing<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$total<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">execute<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$order_id&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">insert_id<\/span><span style=\"color: #007700\">; <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$item_stmt&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">prepare<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'INSERT&nbsp;INTO&nbsp;order_items&nbsp;(order_id,&nbsp;product_id,&nbsp;name,&nbsp;price,&nbsp;quantity,&nbsp;subtotal)&nbsp;VALUES&nbsp;(?,&nbsp;?,&nbsp;?,&nbsp;?,&nbsp;?,&nbsp;?)'<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;foreach&nbsp;(<\/span><span style=\"color: #0000BB\">$items&nbsp;<\/span><span style=\"color: #007700\">as&nbsp;<\/span><span style=\"color: #0000BB\">$pid&nbsp;<\/span><span style=\"color: #007700\">=&gt;&nbsp;<\/span><span style=\"color: #0000BB\">$item<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$subtotal&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$item<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'subtotal'<\/span><span style=\"color: #007700\">]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$pname&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$item<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'name'<\/span><span style=\"color: #007700\">]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$pprice&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$item<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'price'<\/span><span style=\"color: #007700\">]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$pqty&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$item<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'quantity'<\/span><span style=\"color: #007700\">]; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$item_stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">bind_param<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'iisdid'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$order_id<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$pid<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$pname<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$pprice<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$pqty<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$subtotal<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$item_stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">execute<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">commit<\/span><span style=\"color: #007700\">(); <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Send&nbsp;a&nbsp;basic&nbsp;email&nbsp;notification&nbsp;(may&nbsp;require&nbsp;local&nbsp;mail&nbsp;configuration) <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$to&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$email<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$subject&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #DD0000\">'Order&nbsp;Confirmation&nbsp;#'&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #0000BB\">$order_id<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$message&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #DD0000\">\"Thank&nbsp;you&nbsp;for&nbsp;your&nbsp;order.&nbsp;Order&nbsp;ID:&nbsp;<\/span><span style=\"color: #0000BB\">$order_id<\/span><span style=\"color: #DD0000\">\\n\\n\"<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;foreach&nbsp;(<\/span><span style=\"color: #0000BB\">$items&nbsp;<\/span><span style=\"color: #007700\">as&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$message&nbsp;<\/span><span style=\"color: #007700\">.=&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'name'<\/span><span style=\"color: #007700\">]&nbsp;.&nbsp;<\/span><span style=\"color: #DD0000\">'&nbsp;x&nbsp;'&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'quantity'<\/span><span style=\"color: #007700\">]&nbsp;.&nbsp;<\/span><span style=\"color: #DD0000\">'&nbsp;-&nbsp;$'&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$it<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'subtotal'<\/span><span style=\"color: #007700\">],&nbsp;<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">)&nbsp;.&nbsp;<\/span><span style=\"color: #DD0000\">\"\\n\"<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;} <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$message&nbsp;<\/span><span style=\"color: #007700\">.=&nbsp;<\/span><span style=\"color: #DD0000\">\"\\nTotal:&nbsp;$\"&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$total<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">)&nbsp;.&nbsp;<\/span><span style=\"color: #DD0000\">\"\\n\"<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$headers&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #DD0000\">'From:&nbsp;'&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #0000BB\">FROM_EMAIL&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">\"\\r\\n\"<\/span><span style=\"color: #007700\">; <br \/>&nbsp;&nbsp;&nbsp;&nbsp;@<\/span><span style=\"color: #0000BB\">mail<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$to<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$subject<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$message<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$headers<\/span><span style=\"color: #007700\">); <br \/> <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Clear&nbsp;cart&nbsp;and&nbsp;redirect&nbsp;to&nbsp;order&nbsp;status <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$cart<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">clear<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">header<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'Location:&nbsp;..\/order_status.php?order_id='&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #0000BB\">$order_id<\/span><span style=\"color: #007700\">); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;exit; <br \/>}&nbsp;catch&nbsp;(<\/span><span style=\"color: #0000BB\">Exception&nbsp;$e<\/span><span style=\"color: #007700\">)&nbsp;{ <br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">rollback<\/span><span style=\"color: #007700\">(); <br \/>&nbsp;&nbsp;&nbsp;&nbsp;die(<\/span><span style=\"color: #DD0000\">'Order&nbsp;submission&nbsp;failed:&nbsp;'&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #0000BB\">$e<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">getMessage<\/span><span style=\"color: #007700\">()); <br \/>}<\/span><\/pre>\n<h2>Order Status Page (order_status.php)<\/h2>\n<p>This page displays the status of a specific order based on the order ID provided in the query parameters. It retrieves order details from the database and shows whether the order is pending, completed, or canceled.<\/p>\n<pre><span style=\"color: #0000BB\">&lt;?php <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Include&nbsp;configuration&nbsp;and&nbsp;necessary&nbsp;files <br \/><\/span><span style=\"color: #007700\">require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/inc\/db.php'<\/span><span style=\"color: #007700\">; <br \/>require_once&nbsp;<\/span><span style=\"color: #0000BB\">__DIR__&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #DD0000\">'\/inc\/cart.class.php'<\/span><span style=\"color: #007700\">; <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Initialize&nbsp;cart&nbsp;and&nbsp;database&nbsp;connection <br \/><\/span><span style=\"color: #0000BB\">$cart&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;new&nbsp;<\/span><span style=\"color: #0000BB\">Cart<\/span><span style=\"color: #007700\">(); <br \/><\/span><span style=\"color: #0000BB\">$db&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">get_db<\/span><span style=\"color: #007700\">(); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Get&nbsp;order&nbsp;ID&nbsp;from&nbsp;query&nbsp;parameter <br \/><\/span><span style=\"color: #0000BB\">$order_id&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">filter_input<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">INPUT_GET<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #DD0000\">'order_id'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">FILTER_VALIDATE_INT<\/span><span style=\"color: #007700\">); <br \/>if&nbsp;(!<\/span><span style=\"color: #0000BB\">$order_id<\/span><span style=\"color: #007700\">)&nbsp;die(<\/span><span style=\"color: #DD0000\">'Order&nbsp;id&nbsp;missing'<\/span><span style=\"color: #007700\">); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Fetch&nbsp;order&nbsp;details&nbsp;from&nbsp;the&nbsp;database <br \/><\/span><span style=\"color: #0000BB\">$stmt&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">prepare<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'SELECT&nbsp;*&nbsp;FROM&nbsp;orders&nbsp;WHERE&nbsp;id&nbsp;=&nbsp;?&nbsp;LIMIT&nbsp;1'<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">bind_param<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'i'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$order_id<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">execute<\/span><span style=\"color: #007700\">(); <br \/><\/span><span style=\"color: #0000BB\">$order&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$stmt<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">get_result<\/span><span style=\"color: #007700\">()-&gt;<\/span><span style=\"color: #0000BB\">fetch_assoc<\/span><span style=\"color: #007700\">(); <br \/>if&nbsp;(!<\/span><span style=\"color: #0000BB\">$order<\/span><span style=\"color: #007700\">)&nbsp;die(<\/span><span style=\"color: #DD0000\">'Order&nbsp;not&nbsp;found'<\/span><span style=\"color: #007700\">); <br \/> <br \/><\/span><span style=\"color: #FF8000\">\/\/&nbsp;Fetch&nbsp;order&nbsp;items&nbsp;with&nbsp;product&nbsp;image&nbsp;if&nbsp;available <br \/><\/span><span style=\"color: #0000BB\">$itst&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">prepare<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'SELECT&nbsp;oi.*,&nbsp;p.image&nbsp;FROM&nbsp;order_items&nbsp;oi&nbsp;LEFT&nbsp;JOIN&nbsp;products&nbsp;p&nbsp;ON&nbsp;oi.product_id&nbsp;=&nbsp;p.id&nbsp;WHERE&nbsp;oi.order_id&nbsp;=&nbsp;?'<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$itst<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">bind_param<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'i'<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$order_id<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">$itst<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">execute<\/span><span style=\"color: #007700\">(); <br \/><\/span><span style=\"color: #0000BB\">$items&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$itst<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">get_result<\/span><span style=\"color: #007700\">()-&gt;<\/span><span style=\"color: #0000BB\">fetch_all<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">MYSQLI_ASSOC<\/span><span style=\"color: #007700\">); <br \/><\/span><span style=\"color: #0000BB\">?&gt;<\/span>\r\n\r\n<span style=\"color: rgb(95, 94, 78);\"><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"container mt-4\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"py-3 text-center\"<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h2<\/span>&gt;<\/span>Order Confirmation<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h2<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"lead\"<\/span>&gt;<\/span>Below is an example of an order status screen. This screen displays the order submission status to the user.<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">p<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"col-md-12\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"alert alert-success\"<\/span>&gt;<\/span>\r\n      Thank you, <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">htmlspecialchars<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$order<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'first_name'<\/span><span style=\"color: #007700\">]&nbsp;.&nbsp;<\/span><span style=\"color: #DD0000\">'&nbsp;'&nbsp;<\/span><span style=\"color: #007700\">.&nbsp;<\/span><span style=\"color: #0000BB\">$order<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'last_name'<\/span><span style=\"color: #007700\">]);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>. Your order #<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$order<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span> has been received.\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\" style=\"color: rgb(125, 151, 38);\">\"col-md-12 ord-info\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h4<\/span>&gt;<\/span>Order Details<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">h4<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">ul<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">li<\/span>&gt;<\/span>Order ID: <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$order<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">li<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">li<\/span>&gt;<\/span>Date: <span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">$order<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'created_at'<\/span><span style=\"color: #007700\">];&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">li<\/span>&gt;<\/span>\r\n      <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">li<\/span>&gt;<\/span>Total: $<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">number_format<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$order<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'total'<\/span><span style=\"color: #007700\">],<\/span><span style=\"color: #0000BB\">2<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span><span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">li<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">ul<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\" style=\"color: rgb(186, 98, 54);\">&lt;\/<span class=\"hljs-name\" style=\"color: rgb(186, 98, 54);\">div<\/span>&gt;<\/span><\/span>\r\n<\/pre>\n<h2>Frontend JavaScript (assets\/js\/cart.js)<\/h2>\n<p>This JavaScript file provides AJAX helper functions to manage cart operations such as adding items, updating quantities, and removing items from the cart without reloading the page.<\/p>\n<p>AJAX improves usability and avoids page reloads for cart actions. Handled features include:<\/p>\n<ul>\n<li>Add to cart<\/li>\n<li>Update quantity<\/li>\n<li>Remove item<\/li>\n<li>Update cart counter instantly<\/li>\n<li>Display notification messages (success\/error)<\/li>\n<\/ul>\n<pre style=\"color: rgb(68, 68, 68);\"><span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">\/\/ Simple AJAX helpers for cart operations<\/span>\r\n<span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span> <span class=\"hljs-title\" style=\"color: rgb(136, 0, 0); font-weight: 700;\">ajaxPost<\/span>(<span class=\"hljs-params\">url, data<\/span>) <\/span>{\r\n    <span class=\"hljs-keyword\" style=\"font-weight: 700;\">return<\/span> fetch(url, { method: <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'POST'<\/span>, body: data })\r\n        .then(res =&gt; res.json());\r\n}\r\n\r\n<span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">\/\/ Add item to cart<\/span>\r\n<span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span> <span class=\"hljs-title\" style=\"color: rgb(136, 0, 0); font-weight: 700;\">addToCart<\/span>(<span class=\"hljs-params\">productId, qty<\/span>) <\/span>{\r\n    <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> fd = <span class=\"hljs-keyword\" style=\"font-weight: 700;\">new<\/span> FormData();\r\n    fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'action'<\/span>, <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'add'<\/span>);\r\n    fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'product_id'<\/span>, productId);\r\n    fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'quantity'<\/span>, qty || <span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">1<\/span>);\r\n    <span class=\"hljs-keyword\" style=\"font-weight: 700;\">return<\/span> ajaxPost(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'api\/cart_action.php'<\/span>, fd);\r\n}\r\n\r\n<span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">\/\/ Update cart item quantity<\/span>\r\n<span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span> <span class=\"hljs-title\" style=\"color: rgb(136, 0, 0); font-weight: 700;\">updateCart<\/span>(<span class=\"hljs-params\">productId, qty<\/span>) <\/span>{\r\n    <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> fd = <span class=\"hljs-keyword\" style=\"font-weight: 700;\">new<\/span> FormData();\r\n    fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'action'<\/span>, <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'update'<\/span>);\r\n    fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'product_id'<\/span>, productId);\r\n    fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'quantity'<\/span>, qty);\r\n    <span class=\"hljs-keyword\" style=\"font-weight: 700;\">return<\/span> ajaxPost(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'api\/cart_action.php'<\/span>, fd);\r\n}\r\n\r\n<span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">\/\/ Remove item from cart<\/span>\r\n<span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span> <span class=\"hljs-title\" style=\"color: rgb(136, 0, 0); font-weight: 700;\">removeFromCart<\/span>(<span class=\"hljs-params\">productId<\/span>) <\/span>{\r\n    <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> fd = <span class=\"hljs-keyword\" style=\"font-weight: 700;\">new<\/span> FormData();\r\n    fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'action'<\/span>, <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'remove'<\/span>);\r\n    fd.append(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'product_id'<\/span>, productId);\r\n    <span class=\"hljs-keyword\" style=\"font-weight: 700;\">return<\/span> ajaxPost(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'api\/cart_action.php'<\/span>, fd);\r\n}\r\n\r\n<span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">\/\/ Bind UI helpers<\/span>\r\n<span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">document<\/span>.addEventListener(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'click'<\/span>, <span class=\"hljs-function\"><span class=\"hljs-keyword\" style=\"font-weight: 700;\">function<\/span> (<span class=\"hljs-params\">e<\/span>) <\/span>{\r\n    <span class=\"hljs-keyword\" style=\"font-weight: 700;\">if<\/span> (e.target.matches(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'.btn-add-cart'<\/span>)) {\r\n        e.preventDefault();\r\n        <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> pid = e.target.dataset.productId;\r\n        <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> qtyEl = <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">document<\/span>.querySelector(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'#qty-'<\/span> + pid);\r\n        <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> qty = qtyEl ? <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">parseInt<\/span>(qtyEl.value) || <span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">1<\/span> : <span class=\"hljs-number\" style=\"color: rgb(136, 0, 0);\">1<\/span>;\r\n        addToCart(pid, qty).then(resp =&gt; {\r\n            <span class=\"hljs-keyword\" style=\"font-weight: 700;\">if<\/span> (resp.success) {\r\n                <span class=\"hljs-comment\" style=\"color: rgb(136, 136, 136);\">\/\/ Update cart count if present<\/span>\r\n                <span class=\"hljs-keyword\" style=\"font-weight: 700;\">const<\/span> el = <span class=\"hljs-built_in\" style=\"color: rgb(57, 115, 0);\">document<\/span>.querySelector(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'#cart-count'<\/span>);\r\n                <span class=\"hljs-keyword\" style=\"font-weight: 700;\">if<\/span> (el) el.textContent = resp.count || <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">''<\/span>;\r\n                alert(<span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Added to cart'<\/span>);\r\n            } <span class=\"hljs-keyword\" style=\"font-weight: 700;\">else<\/span> {\r\n                alert(resp.message || <span class=\"hljs-string\" style=\"color: rgb(136, 0, 0);\">'Failed to add'<\/span>);\r\n            }\r\n        });\r\n    }\r\n});<\/pre>\n<h2>\ud83c\udf89 Conclusion<\/h2>\n<p>This PHP Shopping Cart System is lightweight, fast, and perfect for small-to-medium eCommerce stores. It covers essential features like product listing, cart management, and order processing while being easy to set up and customize. This Shopping Cart System with PHP is Bootstrap-based, so design customization is easy. Also, custom Cart library class makes it easy to manage cart operations. Here are some key features:<\/p>\n<ul>\n<li>Lightweight and fast PHP Shopping Cart System<\/li>\n<li>Essential eCommerce features covered<\/li>\n<li>Easy to set up and customize<\/li>\n<li>Bootstrap-based design for easy customization<\/li>\n<li>Modular structure for easy maintenance and scalability<\/li>\n<\/ul>\n<p>You can further enhance this system by integrating payment gateways, adding user authentication, and implementing advanced features like product reviews and wishlists. The modular structure allows for easy maintenance and scalability.<\/p>\n<ul>\n<li><a href=\"https:\/\/www.codexworld.com\/paypal-standard-checkout-integration-in-php\/\">PayPal Checkout Integration with PHP<\/a><\/li>\n<li><a href=\"https:\/\/www.codexworld.com\/stripe-payment-gateway-integration-php\/\">Stripe Payment Gateway Integration in PHP<\/a><\/li>\n<li><a href=\"https:\/\/www.codexworld.com\/registration-login-system-php-mysql-session\/\">User Registration and Login System with PHP<\/a><\/li>\n<\/ul>\n<p>Happy coding! \ud83d\ude80<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The shopping cart functionality is an important part of every e-commerce project. It helps the user to select and purchase multiple items at once. Also, the online shopping cart allows viewing the selected items and <\/p>\n","protected":false},"author":1,"featured_media":5972,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[4],"tags":[218,19,14,219],"class_list":["post-1779","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-php","tag-cart","tag-mysql","tag-php","tag-shopping","cat-4-id","has_thumb"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>PHP Shopping Cart System with MySQL using SESSION - CodexWorld<\/title>\n<meta name=\"description\" content=\"Shopping cart system with PHP (MySQLi + SESSION) - Complete step-by-step tutorial. Learn how to build a complete PHP shopping cart system using MySQL, SESSION, and AJAX.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"PHP Shopping Cart System with MySQL using SESSION - CodexWorld\" \/>\n<meta property=\"og:description\" content=\"Shopping cart system with PHP (MySQLi + SESSION) - Complete step-by-step tutorial. Learn how to build a complete PHP shopping cart system using MySQL, SESSION, and AJAX.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/\" \/>\n<meta property=\"og:site_name\" content=\"CodexWorld\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/codexworld\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/codexworld\" \/>\n<meta property=\"article:published_time\" content=\"2016-08-22T18:50:16+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-16T14:46:57+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.codexworld.com\/wp-content\/uploads\/2016\/08\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"CodexWorld\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@codexworldblog\" \/>\n<meta name=\"twitter:site\" content=\"@codexworldweb\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"CodexWorld\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/\"},\"author\":{\"name\":\"CodexWorld\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/person\\\/9da51d8fa3cdefeb5ec9c69136d4baf0\"},\"headline\":\"PHP Shopping Cart System with MySQL using SESSION\",\"datePublished\":\"2016-08-22T18:50:16+00:00\",\"dateModified\":\"2026-01-16T14:46:57+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/\"},\"wordCount\":1490,\"commentCount\":40,\"publisher\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2016\\\/08\\\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg\",\"keywords\":[\"Cart\",\"MySQL\",\"PHP\",\"Shopping\"],\"articleSection\":[\"PHP\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/\",\"name\":\"PHP Shopping Cart System with MySQL using SESSION - CodexWorld\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2016\\\/08\\\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg\",\"datePublished\":\"2016-08-22T18:50:16+00:00\",\"dateModified\":\"2026-01-16T14:46:57+00:00\",\"description\":\"Shopping cart system with PHP (MySQLi + SESSION) - Complete step-by-step tutorial. Learn how to build a complete PHP shopping cart system using MySQL, SESSION, and AJAX.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2016\\\/08\\\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg\",\"contentUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2016\\\/08\\\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg\",\"width\":1920,\"height\":1080,\"caption\":\"ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/simple-php-shopping-cart-using-sessions\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.codexworld.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"PHP Shopping Cart System with MySQL using SESSION\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#website\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/\",\"name\":\"CodexWorld\",\"description\":\"Web &amp; Mobile App Development Company\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.codexworld.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#organization\",\"name\":\"CodexWorld\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2014\\\/09\\\/codexworld-logo.png\",\"contentUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2014\\\/09\\\/codexworld-logo.png\",\"width\":200,\"height\":19,\"caption\":\"CodexWorld\"},\"image\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/codexworld\",\"https:\\\/\\\/x.com\\\/codexworldweb\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/codexworld\",\"https:\\\/\\\/www.youtube.com\\\/codexworld\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/person\\\/9da51d8fa3cdefeb5ec9c69136d4baf0\",\"name\":\"CodexWorld\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g\",\"caption\":\"CodexWorld\"},\"description\":\"CodexWorld is a programming blog, one-stop destination for web professionals \u2014 developers, programmers, freelancers, and site owners.\",\"sameAs\":[\"http:\\\/\\\/www.codexworld.com\",\"https:\\\/\\\/www.facebook.com\\\/codexworld\",\"https:\\\/\\\/x.com\\\/codexworldblog\"],\"url\":\"https:\\\/\\\/www.codexworld.com\\\/author\\\/nitya192265\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"PHP Shopping Cart System with MySQL using SESSION - CodexWorld","description":"Shopping cart system with PHP (MySQLi + SESSION) - Complete step-by-step tutorial. Learn how to build a complete PHP shopping cart system using MySQL, SESSION, and AJAX.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/","og_locale":"en_US","og_type":"article","og_title":"PHP Shopping Cart System with MySQL using SESSION - CodexWorld","og_description":"Shopping cart system with PHP (MySQLi + SESSION) - Complete step-by-step tutorial. Learn how to build a complete PHP shopping cart system using MySQL, SESSION, and AJAX.","og_url":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/","og_site_name":"CodexWorld","article_publisher":"https:\/\/www.facebook.com\/codexworld","article_author":"https:\/\/www.facebook.com\/codexworld","article_published_time":"2016-08-22T18:50:16+00:00","article_modified_time":"2026-01-16T14:46:57+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2016\/08\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg","type":"image\/jpeg"}],"author":"CodexWorld","twitter_card":"summary_large_image","twitter_creator":"@codexworldblog","twitter_site":"@codexworldweb","twitter_misc":{"Written by":"CodexWorld","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/#article","isPartOf":{"@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/"},"author":{"name":"CodexWorld","@id":"https:\/\/www.codexworld.com\/#\/schema\/person\/9da51d8fa3cdefeb5ec9c69136d4baf0"},"headline":"PHP Shopping Cart System with MySQL using SESSION","datePublished":"2016-08-22T18:50:16+00:00","dateModified":"2026-01-16T14:46:57+00:00","mainEntityOfPage":{"@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/"},"wordCount":1490,"commentCount":40,"publisher":{"@id":"https:\/\/www.codexworld.com\/#organization"},"image":{"@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/#primaryimage"},"thumbnailUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2016\/08\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg","keywords":["Cart","MySQL","PHP","Shopping"],"articleSection":["PHP"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/","url":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/","name":"PHP Shopping Cart System with MySQL using SESSION - CodexWorld","isPartOf":{"@id":"https:\/\/www.codexworld.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/#primaryimage"},"image":{"@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/#primaryimage"},"thumbnailUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2016\/08\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg","datePublished":"2016-08-22T18:50:16+00:00","dateModified":"2026-01-16T14:46:57+00:00","description":"Shopping cart system with PHP (MySQLi + SESSION) - Complete step-by-step tutorial. Learn how to build a complete PHP shopping cart system using MySQL, SESSION, and AJAX.","breadcrumb":{"@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/#primaryimage","url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2016\/08\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg","contentUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2016\/08\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg","width":1920,"height":1080,"caption":"ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld"},{"@type":"BreadcrumbList","@id":"https:\/\/www.codexworld.com\/simple-php-shopping-cart-using-sessions\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.codexworld.com\/"},{"@type":"ListItem","position":2,"name":"PHP Shopping Cart System with MySQL using SESSION"}]},{"@type":"WebSite","@id":"https:\/\/www.codexworld.com\/#website","url":"https:\/\/www.codexworld.com\/","name":"CodexWorld","description":"Web &amp; Mobile App Development Company","publisher":{"@id":"https:\/\/www.codexworld.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.codexworld.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.codexworld.com\/#organization","name":"CodexWorld","url":"https:\/\/www.codexworld.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.codexworld.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2014\/09\/codexworld-logo.png","contentUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2014\/09\/codexworld-logo.png","width":200,"height":19,"caption":"CodexWorld"},"image":{"@id":"https:\/\/www.codexworld.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/codexworld","https:\/\/x.com\/codexworldweb","https:\/\/www.linkedin.com\/company\/codexworld","https:\/\/www.youtube.com\/codexworld"]},{"@type":"Person","@id":"https:\/\/www.codexworld.com\/#\/schema\/person\/9da51d8fa3cdefeb5ec9c69136d4baf0","name":"CodexWorld","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g","caption":"CodexWorld"},"description":"CodexWorld is a programming blog, one-stop destination for web professionals \u2014 developers, programmers, freelancers, and site owners.","sameAs":["http:\/\/www.codexworld.com","https:\/\/www.facebook.com\/codexworld","https:\/\/x.com\/codexworldblog"],"url":"https:\/\/www.codexworld.com\/author\/nitya192265\/"}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2016\/08\/ecommerce-shopping-cart-system-with-php-using-session-mysql-codexworld.jpg","jetpack_shortlink":"https:\/\/wp.me\/p6bxIh-sH","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts\/1779","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/comments?post=1779"}],"version-history":[{"count":18,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts\/1779\/revisions"}],"predecessor-version":[{"id":6030,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts\/1779\/revisions\/6030"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/media\/5972"}],"wp:attachment":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/media?parent=1779"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/categories?post=1779"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/tags?post=1779"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}