Hướng dẫn này sẽ dạy bạn tạo một hệ thống tìm kiếm với PHP và MySQL. Bạn sẽ học cách thiết lập HTML, cơ sở dữ liệu MySQL và phụ trợ PHP. Trong mã PHP, bạn sẽ học cách sử dụng câu lệnh chuẩn bị với toán tử LIKE trong SQL
Thiết lập cơ sở dữ liệu
Tải xuống và cài đặt máy chủ XAMPP. Nó đi kèm với MySQL. Khởi chạy shell trong bảng điều khiển XAMPP. Đăng nhập vào vỏ MySQL bằng lệnh sau
# This login command assumes that the
# password is empty and the user is "root"
mysql -u root -p
Sử dụng truy vấn SQL sau để tạo cơ sở dữ liệu có tên là
Query OK, 1 row affected [0.001 sec]
1đầu ra
Query OK, 1 row affected [0.001 sec]
Bạn sẽ cần dữ liệu mẫu mà bạn có thể sử dụng. Vì vậy, hãy thực thi câu lệnh SQL sau trên cơ sở dữ liệu
Query OK, 1 row affected [0.001 sec]
1CREATE TABLE fruit
[id INT NOT NULL AUTO_INCREMENT,
name VARCHAR[20] NOT NULL,
color VARCHAR[20] NOT NULL,
PRIMARY KEY [id]]
ENGINE = InnoDB;
đầu ra
Query OK, 0 rows affected [0.028 sec]
Kiểm tra cấu trúc của bảng
đầu ra
+-------+-------------+------+-----+---------+----------------+
| Field | Type | Null | Key | Default | Extra |
+-------+-------------+------+-----+---------+----------------+
| id | int[11] | NO | PRI | NULL | auto_increment |
| name | varchar[20] | NO | | NULL | |
| color | varchar[20] | NO | | NULL | |
+-------+-------------+------+-----+---------+----------------+
Khi bảng được thiết lập, hãy sử dụng SQL sau để chèn dữ liệu mẫu
INSERT INTO fruit [id, name, color] VALUES [NULL, 'Banana', 'Yellow'], [NULL, 'Pineapple', 'Green']
đầu ra
________số 8_______
Xác nhận sự tồn tại của dữ liệu với SQL sau
đầu ra
+----+-----------+--------+
| id | name | color |
+----+-----------+--------+
| 1 | Banana | Yellow |
| 2 | Pineapple | Green |
+----+-----------+--------+
Tạo mã HTML
Mã HTML cho hệ thống tìm kiếm là một dạng HTML. Biểu mẫu có một đầu vào biểu mẫu duy nhất và nút
Query OK, 1 row affected [0.001 sec]
3. Thuộc tính Query OK, 1 row affected [0.001 sec]
4 trong đầu vào biểu mẫu đảm bảo người dùng nhập nội dung nào đó vào biểu mẫuKhối mã tiếp theo là mã HTML cho biểu mẫu tìm kiếm
Search
CSS sau làm cho biểu mẫu dễ nhìn hơn
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
display: grid;
align-items: center;
place-items: center;
height: 100vh;
}
main {
width: 60%;
border: 2px solid #1560bd;
padding: 2em;
display: flex;
justify-content: center;
}
input,
button {
padding: 0.2em;
}
HTML phải giống như hình ảnh tiếp theo trong trình duyệt web của bạn
Tạo mã PHP
Mã PHP sẽ xử lý việc gửi biểu mẫu. Dưới đây là một bản tóm tắt về cách thức hoạt động của mã
- Kiểm tra biểu mẫu đã gửi của người dùng
- Kết nối với cơ sở dữ liệu
- Thoát khỏi chuỗi tìm kiếm và cắt bớt khoảng trắng
- Kiểm tra các ký tự không hợp lệ như
5 hoặcQuery OK, 1 row affected [0.001 sec]
6 [không có dấu ngoặc kép]Query OK, 1 row affected [0.001 sec]
- Thực hiện tìm kiếm thông qua một tuyên bố chuẩn bị
- Trả kết quả
Khối mã tiếp theo là mã PHP hoàn chỉnh để thực hiện tìm kiếm. Lưu mã vào một tệp có tên là
Query OK, 1 row affected [0.001 sec]
7Query OK, 1 row affected [0.001 sec]
0Hình ảnh tiếp theo chứa kết quả cho chuỗi tìm kiếm
Query OK, 1 row affected [0.001 sec]
8. Nó trả về quả Query OK, 1 row affected [0.001 sec]
9 và màu sắc của nó Các kết quả trong ví dụ trên được tìm thấy trong một tệp XML [liên kết. xml]. Để làm cho ví dụ này nhỏ và đơn giản, chỉ có sáu kết quả có sẵn
Giải thích ví dụ - Trang HTML
Khi người dùng nhập một ký tự vào trường nhập liệu ở trên, hàm "showResult[]" được thực thi. Chức năng được kích hoạt bởi sự kiện "onkeyup"
Giải thích mã nguồn
Nếu trường đầu vào trống [chuỗi. length==0], hàm sẽ xóa nội dung của trình giữ chỗ tìm kiếm trực tiếp và thoát khỏi hàm
Nếu trường đầu vào không trống, hàm showResult[] sẽ thực hiện như sau
- Tạo một đối tượng XMLHttpRequest
- Tạo chức năng sẽ được thực thi khi phản hồi của máy chủ đã sẵn sàng
- Gửi yêu cầu đến một tệp trên máy chủ
- Lưu ý rằng một tham số [q] được thêm vào URL [với nội dung của trường đầu vào]
Tệp PHP
Trang trên máy chủ được gọi bởi JavaScript ở trên là một tệp PHP có tên "livesearch. php"
Mã nguồn trong "livesearch. php" tìm kiếm một tệp XML cho các tiêu đề khớp với chuỗi tìm kiếm và trả về kết quả