code-boxx · November 12, 2023 13:44
diff --git a/0-PHP-ORDER.MD b/0-PHP-ORDER.MD
diff --git a/1-orders.sql b/1-orders.sql
 CREATE TABLE `orders` (
  `order_id` bigint(20) NOT NULL,
  `dop` datetime NOT NULL DEFAULT current_timestamp(),
  `name` varchar(255) NOT NULL,
  `email` varchar(255) NOT NULL,
  `qty` int(5) NOT NULL
 ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

 ALTER TABLE `orders`
  ADD PRIMARY KEY (`order_id`),
  ADD KEY `dop` (`dop`);

 ALTER TABLE `orders`
  MODIFY `order_id` bigint(20) NOT NULL AUTO_INCREMENT;
diff --git a/2-order-form.php b/2-order-form.php
 <!DOCTYPE html>
 <html>
  <head>
    <title>Order Form Example</title>
    <meta charset="utf-8">
    <link href="x-cosmetics.css" rel="stylesheet">
  </head>
  <body>
    <?php
    // (A) PROCESS ORDER FORM
    if (isset($_POST["name"])) {
      require "3-process.php";
      echo $result == ""
        ? "<div class='notify'>Thank You! We have received your order.</div>"
        : "<div class='notify'>$result</div>" ;
    }
    ?>

    <!-- (B) ORDER FORM -->
    <div id="form-wrap">
      <img id="form-img" src="order.png">
      <form id="form-order" method="post" target="_self">
        <label>Name</label>
        <input type="text" name="name" required value="Jon Doe">
  
        <label>Email</label>
        <input type="email" name="email" required value="[email protected]">
  
        <label>Quantity</label>
        <input type="number" name="qty" required min="1" max="99" value="1">
  
        <input type="submit" value="Place Order">
      </form>
    </div>
  </body>
 </html>
diff --git a/3-process.php b/3-process.php
 <?php
 // (A) PROCESS RESULT
 $result = "";

 // (B) CONNECT TO DATABASE - CHANGE SETTINGS TO YOUR OWN!
 $dbhost = "localhost";
 $dbname = "test";
 $dbchar = "utf8mb4";
 $dbuser = "root";
 $dbpass = "";
 $pdo = new PDO(
  "mysql:host=$dbhost;dbname=$dbname;charset=$dbchar",
  $dbuser, $dbpass, [
  PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
  PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC
 ]);

 // (C) SAVE ORDER TO DATABASE
 if ($result=="") { try {
  $stmt = $pdo->prepare("INSERT INTO `orders` (`name`, `email`, `qty`) VALUES (?,?,?)");
  $stmt->execute([$_POST["name"], $_POST["email"], $_POST["qty"]]);
 } catch (Exception $ex) { $result = $ex->getMessage(); }}

 // (D) SEND ORDER VIA EMAIL (OPTIONAL)
 if ($result=="") {
  $to = "[email protected]"; // CHANGE TO YOUR OWN!
  $subject = "ORDER RECEIVED";
  $message = "";
  foreach ($_POST as $k=>$v) { $message .= "$k - $v\r\n"; }
  if (!@mail($to, $subject, $message)) { $result = "Error sending mail!"; }
 }
diff --git a/x-cosmetics.css b/x-cosmetics.css
 /* (A) WHOLE PAGE */
 * {
  font-family: Arial, Helvetica, sans-serif;
  box-sizing: border-box;
 }

 /* (B) NOTIFICATIONS */
 div.notify {
  background: #fff7ce;
  padding: 10px;
  margin-bottom: 20px;
  font-weight: 700;
 }

 /* (C) ORDER FORM */
 #form-wrap { display: flex; }
 #form-img { max-width: 200px; object-fit: cover; }
 #form-order {
  padding: 20px;
  border: 1px solid #efefef;
  background: #f5f5f5;
 }
 #form-order label, #form-order input {
  display: block;
  width: 100%;
 }
 #form-order label { margin: 10px 0; }
 #form-order label:first-child { margin-top: 0; }
 #form-order input {
  font-size: 1em;
  border: 1px solid #e3e3e3;
  padding: 10px;
 }
 #form-order input[type=submit] {
  margin-top: 30px;
  border: 0;
  background: #bf3434;
  color: #fff;
  cursor: pointer;
 }
	CREATE TABLE `orders` (
	`order_id` bigint(20) NOT NULL,
	`dop` datetime NOT NULL DEFAULT current_timestamp(),
	`name` varchar(255) NOT NULL,
	`email` varchar(255) NOT NULL,
	`qty` int(5) NOT NULL
	) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

	ALTER TABLE `orders`
	ADD PRIMARY KEY (`order_id`),
	ADD KEY `dop` (`dop`);

	ALTER TABLE `orders`
	MODIFY `order_id` bigint(20) NOT NULL AUTO_INCREMENT;
	<!DOCTYPE html>
	<html>
	<head>
	<title>Order Form Example</title>
	<meta charset="utf-8">
	<link href="x-cosmetics.css" rel="stylesheet">
	</head>
	<body>
	<?php
	// (A) PROCESS ORDER FORM
	if (isset($_POST["name"])) {
	require "3-process.php";
	echo $result == ""
	? "<div class='notify'>Thank You! We have received your order.</div>"
	: "<div class='notify'>$result</div>" ;
	}
	?>

	<!-- (B) ORDER FORM -->
	<div id="form-wrap">
	<img id="form-img" src="order.png">
	<form id="form-order" method="post" target="_self">
	<label>Name</label>
	<input type="text" name="name" required value="Jon Doe">

	<label>Email</label>
	<input type="email" name="email" required value="[email protected]">

	<label>Quantity</label>
	<input type="number" name="qty" required min="1" max="99" value="1">

	<input type="submit" value="Place Order">
	</form>
	</div>
	</body>
	</html>
	<?php
	// (A) PROCESS RESULT
	$result = "";

	// (B) CONNECT TO DATABASE - CHANGE SETTINGS TO YOUR OWN!
	$dbhost = "localhost";
	$dbname = "test";
	$dbchar = "utf8mb4";
	$dbuser = "root";
	$dbpass = "";
	$pdo = new PDO(
	"mysql:host=$dbhost;dbname=$dbname;charset=$dbchar",
	$dbuser, $dbpass, [
	PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
	PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC
	]);

	// (C) SAVE ORDER TO DATABASE
	if ($result=="") { try {
	$stmt = $pdo->prepare("INSERT INTO `orders` (`name`, `email`, `qty`) VALUES (?,?,?)");
	$stmt->execute([$_POST["name"], $_POST["email"], $_POST["qty"]]);
	} catch (Exception $ex) { $result = $ex->getMessage(); }}

	// (D) SEND ORDER VIA EMAIL (OPTIONAL)
	if ($result=="") {
	$to = "[email protected]"; // CHANGE TO YOUR OWN!
	$subject = "ORDER RECEIVED";
	$message = "";
	foreach ($_POST as $k=>$v) { $message .= "$k - $v\r\n"; }
	if (!@mail($to, $subject, $message)) { $result = "Error sending mail!"; }
	}
	/* (A) WHOLE PAGE */
	* {
	font-family: Arial, Helvetica, sans-serif;
	box-sizing: border-box;
	}

	/* (B) NOTIFICATIONS */
	div.notify {
	background: #fff7ce;
	padding: 10px;
	margin-bottom: 20px;
	font-weight: 700;
	}

	/* (C) ORDER FORM */
	#form-wrap { display: flex; }
	#form-img { max-width: 200px; object-fit: cover; }
	#form-order {
	padding: 20px;
	border: 1px solid #efefef;
	background: #f5f5f5;
	}
	#form-order label, #form-order input {
	display: block;
	width: 100%;
	}
	#form-order label { margin: 10px 0; }
	#form-order label:first-child { margin-top: 0; }
	#form-order input {
	font-size: 1em;
	border: 1px solid #e3e3e3;
	padding: 10px;
	}
	#form-order input[type=submit] {
	margin-top: 30px;
	border: 0;
	background: #bf3434;
	color: #fff;
	cursor: pointer;
	}