สวัสดีครับ ในบทความนี้จะแจกตัวอย่างระบบค้นหาข้อมูลหรือเรียกดูข้อมูลจากการเลือกวันที่แบบง่ายๆ สำหรับเอาไปทำระบบเรียกดูข้อมูลหรือรายงานในอนาคต โดยเขียนในรูปแบบ PHP PDO รองรับการทำงาน PHP7 และ PHP8 สำหรับเอาไปศึกษาและพัฒนาต่อยอดครับ *ฝึกไว้ครับเผื่อได้ใช้
ตัวอย่างระบบที่มีการเรียกดูข้อมูลจากวันที่
1.ระบบร้านอาหารออนไลน์ (FOOD POS) คลิก
2.ระบบร้านกาแฟออนไลน์ (Coffee POS) คลิก
3.ระบบอีคอมเมิร์ช คลิก
4.ระบบอื่นๆ เพิ่มเติม คลิก
รวมคลิปสอนปรับพื้นฐาน ภาษา php ฟรี 100 คลิป ++ https://devbanban.com/?p=3940
โค้ดประกอบด้วย
- PHP PDO
- MySQL
- HTML
- Bootstrap5 Class form , btn , grid system
- ฟอร์มเลือกวันที่
- แสดงข้อมูลในรูปแบบตาราง
- การหาผลรวมภายใน loop
- การแสดงลำดับใหม่แทนไอดีจากตาราง
- CSS ตกแต่ง input type=”date”
- เงื่อนไข
มาเริ่มทำ workshop กันครับ *คอมเม้นอยู่ในโค้ด
0.รวม Workshop PHP PDO ก่อนหน้าคลิก
1.ให้สร้างฐานข้อมูลก่อนครับ เช่น ฐานข้อมูลชื่อ workshop_pdo
2.ตารางเก็บข้อมูลรายการขาย tbl_order พร้อมข้อมูลตัวอย่าง (จากนั้นไปที่เมนู sql คัดลอกโค้ดไปวางและ go)
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 |
CREATE TABLE `tbl_order` ( `no` int(11) NOT NULL, `product_name` varchar(100) NOT NULL, `price_total` float(10,2) NOT NULL, `order_date` date NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=utf8; INSERT INTO `tbl_order` (`no`, `product_name`, `price_total`, `order_date`) VALUES (1, 'ชื่อสินค้า', 40.00, '2021-08-06'), (2, 'ชื่อสินค้า', 50.00, '2021-08-06'), (3, 'ชื่อสินค้า', 50.00, '2021-08-13'), (4, 'ชื่อสินค้า', 50.00, '2021-08-13'), (5, 'ชื่อสินค้า', 50.00, '2021-08-13'), (6, 'ชื่อสินค้า', 40.00, '2021-08-13'), (7, 'ชื่อสินค้า', 60.00, '2021-08-13'), (8, 'ชื่อสินค้า', 40.00, '2021-08-13'), (9, 'ชื่อสินค้า', 50.00, '2021-08-13'), (10, 'ชื่อสินค้า', 60.00, '2021-08-13'), (11, 'ชื่อสินค้า', 50.00, '2021-08-19'), (12, 'ชื่อสินค้า', 40.00, '2021-08-19'), (13, 'ชื่อสินค้า', 20.00, '2021-08-19'), (14, 'ชื่อสินค้า', 120.00, '2021-08-26'), (15, 'ชื่อสินค้า', 300.00, '2021-08-26'), (16, 'ชื่อสินค้า', 60.00, '2021-08-26'), (17, 'ชื่อสินค้า', 150.00, '2021-08-26'), (18, 'ชื่อสินค้า', 60.00, '2021-08-26'), (19, 'ชื่อสินค้า', 50.00, '2021-08-30'), (20, 'ชื่อสินค้า', 20.00, '2021-08-30'), (21, 'ชื่อสินค้า', 50.00, '2021-08-30'), (22, 'ชื่อสินค้า', 40.00, '2021-08-30'), (23, 'ชื่อสินค้า', 120.00, '2021-08-30'), (24, 'ชื่อสินค้า', 20.00, '2021-09-02'), (25, 'ชื่อสินค้า', 50.00, '2021-09-03'), (26, 'ชื่อสินค้า', 20.00, '2021-09-03'), (27, 'ชื่อสินค้า', 40.00, '2021-09-05'), (28, 'ชื่อสินค้า', 50.00, '2021-09-05'), (29, 'ชื่อสินค้า', 20.00, '2021-09-05'), (30, 'ชื่อสินค้า', 50.00, '2021-09-05'), (31, 'ชื่อสินค้า', 40.00, '2021-09-05'), (32, 'ชื่อสินค้า', 50.00, '2021-09-05'), (33, 'ชื่อสินค้า', 50.00, '2021-09-05'), (34, 'ชื่อสินค้า', 40.00, '2021-09-05'), (35, 'ชื่อสินค้า', 200.00, '2021-09-09'), (36, 'ชื่อสินค้า', 50.00, '2021-09-09'), (37, 'ชื่อสินค้า', 20.00, '2021-09-09'), (38, 'ชื่อสินค้า', 50.00, '2021-09-09'), (39, 'ชื่อสินค้า', 360.00, '2021-09-09'), (40, 'ชื่อสินค้า', 0.00, '2021-09-15'), (41, 'ชื่อสินค้า', 40.00, '2021-09-15'), (42, 'ชื่อสินค้า', 40.00, '2021-09-19'), (43, 'ชื่อสินค้า', 40.00, '2021-09-19'), (44, 'ชื่อสินค้า', 60.00, '2021-09-19'), (45, 'ชื่อสินค้า', 100.00, '2021-09-19'), (46, 'ชื่อสินค้า', 40.00, '2021-09-21'), (47, 'ชื่อสินค้า', 50.00, '2021-09-21'), (48, 'ชื่อสินค้า', 20.00, '2021-09-21'), (49, 'ชื่อสินค้า', 50.00, '2021-09-21'), (50, 'ชื่อสินค้า', 60.00, '2021-09-21'), (51, 'ชื่อสินค้า', 40.00, '2021-09-23'), (52, 'ชื่อสินค้า', 50.00, '2021-09-23'), (53, 'ชื่อสินค้า', 50.00, '2021-09-23'), (54, 'ชื่อสินค้า', 40.00, '2021-09-23'), (55, 'ชื่อสินค้า', 20.00, '2021-09-28'), (56, 'ชื่อสินค้า', 50.00, '2021-09-28'), (57, 'ชื่อสินค้า', 80.00, '2021-10-02'), (58, 'ชื่อสินค้า', 200.00, '2021-10-02'), (59, 'ชื่อสินค้า', 40.00, '2021-10-04'), (60, 'ชื่อสินค้า', 50.00, '2021-10-04'), (61, 'ชื่อสินค้า', 20.00, '2021-10-04'), (62, 'ชื่อสินค้า', 50.00, '2021-10-04'), (63, 'ชื่อสินค้า', 40.00, '2021-10-06'), (64, 'ชื่อสินค้า', 20.00, '2021-10-08'), (65, 'ชื่อสินค้า', 50.00, '2021-10-08'), (66, 'ชื่อสินค้า', 60.00, '2021-10-08'), (67, 'ชื่อสินค้า', 40.00, '2021-10-21'), (68, 'ชื่อสินค้า', 50.00, '2021-10-21'), (69, 'ชื่อสินค้า', 20.00, '2021-10-24'), (70, 'ชื่อสินค้า', 60.00, '2021-10-24'); ALTER TABLE `tbl_order` ADD PRIMARY KEY (`no`); ALTER TABLE `tbl_order` MODIFY `no` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=71; |
3.สร้างโฟลเดอร์สำหรับทดสอบ เช่น ชื่อโฟลเดอร์ workshop_pdo *สำหรับคนที่เพิ่งฝึกยังไม่เข้าใจข้อนี้ว่าต้องสร้างไว้ที่ไหน ให้ดูคลิปชุดนี้ก่อน รวมคลิปสอนปรับพื้นฐาน ภาษา php ฟรี 100 คลิป ++ https://devbanban.com/?p=3940
4.ไฟล์เชื่อมต่อฐานข้อมูล ชื่อไฟล์ connect.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<?php $servername = "localhost"; $username = "root"; $password = "yourpassword"; //ไม่ได้ตั้งรหัสผ่านก็ลบ yourpassword ออก try { $conn = new PDO("mysql:host=$servername;dbname=workshop_pdo", $username, $password); // set the PDO error mode to exception $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); //echo "Connected successfully"; } catch(PDOException $e) { echo "Connection failed: " . $e->getMessage(); } //Set ว/ด/ป เวลา ให้เป็นของประเทศไทย date_default_timezone_set('Asia/Bangkok'); ?> |
5.ไฟล์ Workshop showDataByDate.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous"> <title>Basic PHP PDO SQL Search data by date : devbanban.com 2021</title> <style type="text/css"> input[type="date"]::-webkit-datetime-edit, input[type="date"]::-webkit-inner-spin-button, input[type="date"]::-webkit-clear-button { color: #fff; position: relative; } input[type="date"]::-webkit-datetime-edit-year-field{ position: absolute !important; border-left:1px solid #8c8c8c; padding: 2px; color:red; left: 56px; } input[type="date"]::-webkit-datetime-edit-month-field{ position: absolute !important; border-left:1px solid #8c8c8c; padding: 2px; color:red; left: 26px; } input[type="date"]::-webkit-datetime-edit-day-field{ position: absolute !important; color:red; padding: 2px; left: 4px; } /* ตัวอย่าง css จาก : https://stackoverflow.com/questions/7372038/is-there-any-way-to-change-input-type-date-format */ </style> </head> <body> <div class="container"> <div class="row"> <div class="col-md-12"> <br> <h4>PHP PDO : เรียกดูข้อมูลจากการเลือกวันที่</h4> <form action="" method="get"> <font color="red">*เรียกดูข้อมูลระหว่างวันที่ 2021-08-01 ถึง 2021-10-30 (มีข้อมูลตัวอย่างแค่นี้ครับ)</font> <input type="date" name="q" data-date-format="dd-mm-Y" min="2021-08-01" max="2021-10-30" class="form-control" required value="2021-10-24"> <br> <button type="submit" class="btn btn-primary">ค้นหาข้อมูล</button> <a href="showDataByDate.php" class="btn btn-warning">เคลียร์ข้อมูล</a> </form> <?php //ถ้ามีการส่ง $_GET['q'] if (isset($_GET['q'])){ //คิวรี่ข้อมูลมาแสดงในตาราง require_once 'connect.php'; //ประกาศตัวแปรรับค่าจากฟอร์ม $stmt = $conn->prepare("SELECT * FROM tbl_order WHERE order_date=?"); $stmt->execute([$_GET['q']]); $result = $stmt->fetchAll(); //แสดงข้อมูลทั้งหมด //ถ้าเจอข้อมูลมากกว่า 0 if($stmt->rowCount() > 0) { ?> <br> <h3>รายการขายวันที่ : <?= date('d/m/Y',strtotime($_GET['q']));?></h3> <table class="table table-striped table-hover table-responsive table-bordered"> <thead> <tr> <th width="5%">ลำดับ</th> <th width="55%">ชื่อสินค้า</th> <th width="20%" class="text-center">ยอดขาย</th> <th width="20%" class="text-center">ว/ด/ป</th> </tr> </thead> <tbody> <?php //ประกาศตัวแปรแสดงลำดับ $i=1; //ประกาศตัวแปรผลรวม $total =0; foreach($result as $row) { //หาผลรวมยอดขายใน loop โดยใข้ += $total += $row['price_total']; ?> <tr> <td class="text-center"><?= $i++; //แสดงลำดับแทนไอดี ?></td> <td><?= $row['product_name'];?></td> <td align="right"><?= $row['price_total'];?></td> <td class="text-center"><?= date('d/m/Y',strtotime($row['order_date']));?></td> </tr> <?php } ?> <tr class="table-danger"> <td colspan="2" class="text-center">Total</td> <td align="right"><?= number_format($total,2);?></td> <td class="text-center">บาท</td> </tr> </tbody> </table> <br> <?php } // if ($stmt->rowCount() > 0) { else{ echo '<center> -ไม่พบข้อมูล !! </center>'; } } //isset ?> <center> <br> <a href="https://devbanban.com/?cat=250" target="_blank">คอร์สออนไลน์ คลิก</a> || <a href="https://devbanban.com/?p=3196" target="_blank">ระบบพร้อมใช้ คลิก</a> </center> </div> </div> </div> </body> </html> |
5.ผลการทำงาน
ลองเอาไปประยุกต์ใช้ดูครับ และฝากติดตาม workshop ต่อๆ ไปด้วยครับผม
Bootstrap5 : https://getbootstrap.com/
ฝึก SQL : https://www.w3schools.com/sql/default.asp
แหล่งศึกษา PDO เพิ่มเติม : https://websitebeaver.com/php-pdo-vs-mysqli
List of PDOStatement::bindParam data_type parameters : https://www.php.net/manual/en/pdo.constants.php
ขอแนะนำระบบพร้อมใช้งาน *รายละเอียดและราคาอยู่ใต้คลิป
ระบบพร้อมใช้ทั้งหมด คลิก
ร่วมสนับสนุน ค่ากาแฟ ค่าโฮส devbanban.com ได้ที่
ธนาคารกรุงไทย สาขาเดอะมอลล์ท่าพระ
ชื่อบัญชี นายพิศิษฐ์ บวรเลิศสุธี เลขที่ 878-0-17747-6
————————————————————————————
ธนาคารไทยพาณิชย์ สาขามหาวิทยาลัยราชภัฏธนบุรี
ชื่อบัญชี นายพิศิษฐ์ บวรเลิศสุธี เลขที่ 406-359094-1
fanpage : https://www.facebook.com/sornwebsites/