Hướng dẫn how to connect html form to mysql database using wamp server - cách kết nối biểu mẫu html với cơ sở dữ liệu mysql bằng máy chủ wamp

Cập nhật vào ngày 25 tháng 11 năm 2022 bởi ZeeshanZeeshan

Tạo hình thức HTML rất dễ dàng. Nhưng việc kết nối biểu mẫu HTML đó với cơ sở dữ liệu MySQL sử dụng PHP có thể hơi phức tạp cho người mới bắt đầu. Nhưng đây không phải là khoa học tên lửa, hãy tin tôi rằng bạn có thể làm điều đó rất dễ dàng. Hướng dẫn này sẽ dạy bạn, cách kết nối biểu mẫu HTML với cơ sở dữ liệu MySQL với sự trợ giúp của PHP.

Sau khi đọc hướng dẫn này, bạn sẽ có thể:

• Lưu các mục nhập biểu mẫu HTML trong cơ sở dữ liệu.
• Tạo cơ sở dữ liệu MySQL
• Tạo bảng trong cơ sở dữ liệu MySQL
• Kết nối HTML với cơ sở dữ liệu MySQL bằng Php
• Tạo tệp PHP để nhận các mục nhập

Vậy hãy bắt đầu.

Đầu tiên và quan trọng nhất, câu hỏi quan trọng nhất phát sinh ở đây là. Chúng ta cần gì? Chúng tôi chỉ cần hai điều mà một trình soạn thảo văn bản và phần mềm máy chủ XAMPP.

Vậy chúng ta sẽ làm gì? Hãy cùng xem các bước mà chúng ta sẽ thực hiện trong bài viết này. Bạn có thể nhảy vào bất kỳ bước nào dưới đây bằng cách nhấp vào:

1. Đầu tiên, chúng tôi sẽ cài đặt và chạy XAMPP trên PC hoặc máy tính xách tay của bạn.
2. Sau đó, tiếp theo, tạo cơ sở dữ liệu MySQL để kết nối với biểu mẫu HTML.
3. Tạo một bảng trong cơ sở dữ liệu MySQL để lưu các mục nhập biểu mẫu HTML.
4. Tạo biểu mẫu HTML.
5. Sau đó, chúng tôi sẽ tạo một tệp PHP để nhận các mục nhập biểu mẫu HTML.
6. Cuối cùng, chúng tôi sẽ tạo một kết nối để lưu dữ liệu biểu mẫu HTML trong cơ sở dữ liệu MySQL.

Cách kết nối biểu mẫu HTML với cơ sở dữ liệu MySQL bằng PHP bằng cách sử dụng PHP

Hãy bắt đầu với bước đầu tiên của chúng tôi.

1. Cài đặt và chạy XAMPP trên PC của bạn để tạo cơ sở dữ liệu MySQL cho biểu mẫu HTML

Bạn có thể tải xuống XAMPP từ trang web ApacheFriends.org. Đó là phần mềm webserver nguồn mở và có sẵn miễn phí. XAMPP cho phép chúng tôi tạo môi trường máy chủ trên máy tính cục bộ của chúng tôi.

Chúng tôi cần XAMPP vì PHP và SQL là các ngôn ngữ phía máy chủ, vì vậy chúng tôi cần một máy chủ. Ngoài ra, để lưu các mục nhập biểu mẫu HTML trong cơ sở dữ liệu, chúng tôi cần cơ sở dữ liệu MySQL. XAMPP cho phép chúng tôi tạo cơ sở dữ liệu MySQL và chạy PHP.

Có các phần mềm khác như Wamp và Mamp, v.v. để tạo một máy chủ web. Nhưng tôi đã chọn XAMPP vì nó có sẵn trong nhiều hệ điều hành như Windows, Mac OS và Linux.

Mẹo: Nếu bạn muốn biết thêm về XAMPP thì hãy kiểm tra hướng dẫn này trên cài đặt WordPress trên localhost bằng XAMPP. Trong hướng dẫn này, bạn cũng sẽ tìm hiểu thêm về XAMPP là gì? Và làm thế nào để tải xuống và cài đặt XAMPP? Và nếu bạn là người dùng WordPress thì hướng dẫn này sẽ thực sự giúp bạn. If you want to know more about XAMPP then check this guide on WordPress installation on localhost using XAMPP. In this guide, you will also learn more about what is XAMPP? And how to download and install XAMPP? And if you are a WordPress user then this guide will really help you.

Bây giờ hãy để Lừa đi đến chủ đề chính.

Sau khi tải xuống XAMPP, hãy tiếp tục cài đặt và chạy XAMPP trên PC hoặc máy tính xách tay của bạn. Khi bạn sẽ mở XAMPP, chỉ cần chạy máy chủ Apache và MySQL như trong hình ảnh bên dưới.Apache and MySQL server as shown in the image below.

Bây giờ bạn đã được tạo một máy chủ web cục bộ trên máy tính của bạn. Nó sẽ cho phép bạn chạy và thực thi mã PHP và SQL. Bây giờ chúng ta có thể tạo cơ sở dữ liệu MySQL. Để kết nối biểu mẫu HTML với cơ sở dữ liệu MySQL bằng PHP, chúng tôi cần cơ sở dữ liệu.

Giảm thiểu XAMPP. Don lồng đóng nó.

Hãy cùng xem bước thứ hai.

2. Tạo cơ sở dữ liệu MySQL để kết nối với biểu mẫu HTML

Để làm điều này, hãy mở trình duyệt của bạn. Và nhập localhost/phpmyadmin vào thanh tìm kiếm của bạn và nhấn enter. Như thể hiện trong hình ảnh dưới đây.localhost/PHPMyAdmin in your browser’s search bar and press enter. As shown in the image below.

Điều này sẽ đưa bạn đến trang phpmyadmin. Nơi chúng tôi sẽ tạo cơ sở dữ liệu MySQL để lưu các mục nhập biểu mẫu HTML.PHPMyAdmin page. Where we will create a MySQL database to save HTML form entries.

Giới thiệu nhanh về phpmyadmin: Đây là một công cụ quản trị miễn phí và phổ biến nhất cho cơ sở dữ liệu MySQL. Lợi ích của việc sử dụng phpmyadmin là chúng ta có thể tạo và quản lý cơ sở dữ liệu mà không có bất kỳ kiến ​​thức nào về ngôn ngữ SQL. to PHPMyAdmin: It is a free and most popular administration tool for MySQL databases. The benefit of using PHPMyAdmin is that we can create and manage databases without having any knowledge of SQL language.

Bây giờ xem hình ảnh tiếp theo bên dưới. Trong hình ảnh này, ở phía bên trái, tất cả các cơ sở dữ liệu được liệt kê. Chỉ cần nhấp vào nút mới để thêm cơ sở dữ liệu mới.New button to add a new database.

Trên trang tiếp theo, bạn sẽ chọn tên cơ sở dữ liệu của mình. Sau đó, nhấp vào nút Tạo. Bạn có thể đặt bất kỳ tên nào cho cơ sở dữ liệu của bạn. Tôi sẽ đặt cho nó một tên form_entriesdb. Bạn có thể sử dụng dấu dưới tên của bạn. Như thể hiện trong hình ảnh dưới đây.

Bây giờ cơ sở dữ liệu đã được tạo thành công. Trên trang tiếp theo, bạn sẽ tạo một bảng trong cơ sở dữ liệu của mình. Don lồng đóng trang. Hãy cùng xem bước thứ ba của bài học này.

3. Tạo bảng trong cơ sở dữ liệu MySQL để lưu các mục nhập mẫu HTML

Sau khi tạo cơ sở dữ liệu MySQL cho biểu mẫu HTML, bạn sẽ được chuyển hướng đến trang bảng. Chỉ cần xem hình ảnh dưới đây.

Đặt tên bảng. Trong trường hợp của tôi, tôi đặt tên cho bảng của tôi (contactform_entries). Sau đó, nhập số lượng cột trong bảng.

Ở đây, hãy nhớ các cột này là mọi đầu vào hình thức HTML mà người dùng sẽ nhập.

Trong trường hợp nếu bạn có ba trường đầu vào như tên, email và tin nhắn. Sau đó, sẽ có bốn cột trong bảng cơ sở dữ liệu như ID, tên, email và tin nhắn.Name, Email, and Message. Then there will be four columns in the database table like Id, Name, Email, and Message.

Vì vậy, chúng tôi sẽ có ba trường đầu vào ở dạng HTML của chúng tôi. Tôi sẽ nhập 4 ở đây. Bởi vì ID sẽ tự động tăng và cho chúng tôi biết có bao nhiêu mục đã được lưu. Nó chỉ là cho sự thuận tiện của chúng tôi.

Khi chúng tôi xuất một bảng cơ sở dữ liệu trong một tệp Excel. ID không hiển thị theo mặc định nếu chúng tôi không tạo một cột có ID tên.

Sau khi nhập tên bảng và số cột, nhấp vào nút GO để tạo bảng.Go button to create a table.

Bây giờ xem hình ảnh tiếp theo bên dưới. Ở đây chúng tôi sẽ nhập chi tiết cột của chúng tôi.

Mỗi cột nên có một tên, kiểu dữ liệu, độ dài của các ký tự, v.v. Vì vậy, chúng tôi có thể lưu trữ dữ liệu theo cột của chúng tôi trong cơ sở dữ liệu.

Điền vào tất cả các chi tiết như tôi đã đưa ra dưới đây.

Sơ đẳng

name_fld

Varchar

Email_FLD

MSG_FLD

CHỮPrivileges tab as shown in the image below.

Xem nó sẽ trông như thế này trong hình ảnh dưới đây. Vẫn là các lĩnh vực khác như nó là. Chỉ điền vào các chi tiết cho tên, loại, độ dài và chỉ mục null chỉ cho ID. Just make sure your database is selected otherwise you’ll not see the ‘Privileges’ option.

Sau đó nhấp vào nút Lưu nằm ở phía dưới để lưu.

Chỉ có một điều còn lại sau đó chúng ta sẽ đi đến hình thức HTML của chúng ta. Add user account, provide these details.

Tạo người dùng cơ sở dữ liệu MySQL này và gán các đặc quyền: I created a user name with the name formdb_user, then in the dropdown, I selected localhost, and then the password abc123.

Mỗi cơ sở dữ liệu MySQL phải có ít nhất một người dùng có thể truy cập, chỉnh sửa, lưu và truy xuất dữ liệu từ cơ sở dữ liệu đó.Go button to save.

Để tạo người dùng, hãy chuyển đến tab Đặc quyền như trong hình ảnh bên dưới.

Lưu ý: Chỉ cần đảm bảo cơ sở dữ liệu của bạn được chọn nếu không bạn sẽ không thấy tùy chọn ‘Đặc quyền.

Trong tab Đặc quyền, chúng tôi sẽ tạo người dùng cho cơ sở dữ liệu này. Và những chi tiết này sẽ cần thiết trong quá trình kết nối cơ sở dữ liệu bằng PHP.

Sau khi nhấp vào Thêm tài khoản người dùng, cung cấp các chi tiết này.

Hãy nhớ các chi tiết sau: Tôi đã tạo một tên người dùng có tên formdb_user, sau đó trong bản thả xuống, tôi đã chọn localhost, và sau đó là mật khẩu abc123.

Bây giờ, nhấp vào kiểm tra để gán tất cả các đặc quyền cho người dùng này. Và sau đó cuộn xuống cuối trang. Và nhấp vào nút GO để lưu.

Bây giờ phần cơ sở dữ liệu đã được thực hiện.

Trước khi đi đến bước thứ tư. Chúng tôi phải tạo một thư mục với tên TestSite trong thư mục HTDOCS nằm bên trong thư mục XAMPP. Trong thư mục đó, chúng tôi sẽ đặt các tệp mã của chúng tôi.

Tạo một thư mục trong HTDOCS và đặt tên nó ‘TestSite

Để làm điều này, hãy mở thư mục XAMPP nơi bạn đã cài đặt nó. Trong thư mục XAMPP, tìm một thư mục có tên là tài liệu. Đây là thư mục nơi chúng tôi đặt các tệp trang web của chúng tôi trên máy chủ cục bộ.

Mở nó và tạo một thư mục và đặt tên cho nó TestSite. Trong thư mục này, chúng tôi sẽ đặt biểu mẫu HTML, bảng kiểu CSS và tệp PHP. Để chúng tôi có thể truy cập chúng trên PC của chúng tôi.

 lang="en-US">

 charset="UTF-8">
 http-equiv="X-UA-Compatible" content="IE=edge">
 name="viewport" content="width=device-width, initial-scale=1.0">

 rel="stylesheet" href="style.css" type="text/css">


 class="form">
     method="POST" action="form.php">
        
Contact Form
        

            

                

                     for="fname">Full Name:

                     type="text" name="fname" placeholder="John Doe" id="">
                



 for="email">Your Email:

 type="email" name="email" placeholder="" id="">




 for="msg">Your Message:

 name="msg" placeholder="Type your message..." id="" cols="30" rows="10">




 type="submit" name="submit" value="Send Message">