Hướng dẫn multiple image upload with view edit and delete in php - tải lên nhiều hình ảnh với chế độ xem chỉnh sửa và xóa trong php
Show
Tải lên nhiều hình ảnh cùng một lúc giúp giảm thời gian tải lên một số lượng lớn hình ảnh lên máy chủ. Nó cũng cung cấp một cách thân thiện với người dùng để tải lên nhiều hình ảnh lên máy chủ cùng một lúc thay vì từng người một. Nhiều chức năng tải lên hình ảnh rất hữu ích cho phần Quản lý bộ sưu tập động trên ứng dụng web. Nó cũng rất hữu ích cho phần quản lý sản phẩm, nơi nhiều hình ảnh cần được tải lên cho mỗi sản phẩm. at once helps to reduce the time taking for uploading a large number of images to the server. It also provides a user-friendly way to upload multiple images to the server at once instead of one-by-one. Multiple image upload functionality is very useful for the dynamic gallery management section on the web application. It is also very useful for product management section where multiple images need to be uploaded for each product. Nhiều hình ảnh có thể được tải lên trên một lần nhấp bằng PHP. Không chỉ các hình ảnh mà bạn còn có thể tải dữ liệu với hình ảnh lên máy chủ bằng PHP và MySQL. Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách tải lên nhiều hình ảnh và quản lý dữ liệu (xem, chỉnh sửa và xóa) với PHP và MySQL.upload multiple images and manage (view, edit, and delete) data with PHP and MySQL. Trong tập lệnh ví dụ, chúng tôi sẽ triển khai một hệ thống quản lý bộ sưu tập với nhiều hình ảnh bằng PHP và MySQL.
Trước khi bắt đầu, hãy xem cấu trúc tệp của tập lệnh quản lý tải lên nhiều hình ảnh. multiple_image_upload_crud/ ├── index.php ├── view.php ├── addEdit.php ├── postAction.php ├── DB.class.php ├── uploads/ │ └── images/ ├── js/ │ └── jquery.min.js ├── bootstrap/ │ └── bootstrap.min.css ├── css/ │ └── style.css └── images/ Tạo bảng cơ sở dữ liệuĐể lưu trữ thông tin về bộ sưu tập và hình ảnh, hai bảng cần được tạo trong cơ sở dữ liệu. 1. SQL sau đây tạo bảng CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;1 table with some basic fields in the MySQL database. CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci; 2. SQL sau đây tạo bảng CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;2 table with parent gallery identifier field (gallery_id) in the MySQL database. CREATE TABLE `gallery_images` ( `id` int(11) NOT NULL AUTO_INCREMENT, `gallery_id` int(11) NOT NULL, `file_name` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `uploaded_on` datetime NOT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci; Lớp cơ sở dữ liệu (db.class.php)Lớp DB xử lý tất cả các hoạt động liên quan đến cơ sở dữ liệu (kết nối, chèn, cập nhật và xóa). Chỉ định máy chủ cơ sở dữ liệu ( CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;3), tên người dùng ( CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;4), mật khẩu ( CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;5) và tên ( CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;6) theo thông tin xác thực cơ sở dữ liệu MySQL của bạn.
/* Thư viện bootstrapThư viện Bootstrap 4 được sử dụng để thiết kế bảng, danh sách, trường biểu mẫu và liên kết. Vì vậy, bao gồm tệp CSS của thư viện Bootstrap. Nếu bạn không muốn sử dụng bootstrap, hãy bỏ qua nó bao gồm. <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"> Danh sách thư viện (index.php)Ban đầu, tất cả các dữ liệu bộ sưu tập được lấy từ cơ sở dữ liệu và được liệt kê trong chế độ xem bảng với chế độ xem, thêm, chỉnh sửa và xóa các nút.
// Start session Xóa hình ảnh thư viện thông qua AjaxTrong các tệp CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;7 và CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;8, hình ảnh xóa chức năng được tích hợp. JQuery được sử dụng để xóa hình ảnh từ bộ sưu tập thông qua Ajax. Bao gồm thư viện jQuery nơi sử dụng chức năng xóa hình ảnh của bộ sưu tập. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">script> Hàm Xóa () Bắt đầu yêu cầu AJAX để xóa hình ảnh khỏi thư viện.deleteImage() function initiate AJAX request to delete image from gallery.
<script> function deleteImage(id){ var result = confirm("Are you sure to delete?"); if(result){ $.post( "postAction.php", {action_type:"img_delete",id:id}, function(resp) { if(resp == 'ok'){ $('#imgb_'+id).remove(); alert('The image has been removed from the gallery'); }else{ alert('Some problem occurred, please try again.'); } }); } } script> Hiển thị nhiều hình ảnh với thông tin thư viện (View.php)Trong tệp CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;7, thông tin thư viện được hiển thị.
if(empty($_GET['id'])){ Nhiều hình ảnh tải lên và biểu mẫu thêm/chỉnh sửa dữ liệu (bổ sung.php)Tệp CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;8 giữ biểu mẫu HTML cho phép người dùng chọn nhiều tệp hình ảnh và cung cấp tên thư viện.
// Start session Tải lên nhiều hình ảnh, thêm, chỉnh sửa và xóa bản ghi (postaction.php)Tệp này xử lý nhiều tệp tải lên và thêm, chỉnh sửa và xóa các hoạt động bằng PHP và MySQL. 1. Thêm / chỉnh sửa biểu mẫu Gửi:
2. Bộ sưu tập không hoạt động (action_type => block):
3. Kích hoạt bộ sưu tập (Action_Type => bỏ chặn):
3. Kích hoạt bộ sưu tập (Action_Type => bỏ chặn):
Xóa hình ảnh khỏi thư mục của máy chủ.
Xóa tệp hình ảnh khỏi thư mục của máy chủ. CREATE TABLE `gallery` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;0 Phương pháp CREATE TABLE `gallery_images` ( `id` int(11) NOT NULL AUTO_INCREMENT, `gallery_id` int(11) NOT NULL, `file_name` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `uploaded_on` datetime NOT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;1 của lớp DB được sử dụng để xóa dữ liệu hình ảnh khỏi cơ sở dữ liệu. Sau khi thao tác dữ liệu, trạng thái được lưu trữ trong phiên PHP và chuyển hướng đến trang tương ứng.Php crud hoạt động với tìm kiếm và phân trangmultiple images upload management script is very useful for dynamic data management section in the web application. This script can be used for many purposes, like products management with multiple images using PHP and MySQL. You can easily enhance the functionality of this script and use in any data management section where multiple image upload functionality is needed. Sự kết luận Tập lệnh quản lý tải lên nhiều hình ảnh này rất hữu ích cho phần quản lý dữ liệu động trong ứng dụng web. Kịch bản này có thể được sử dụng cho nhiều mục đích, như quản lý sản phẩm với nhiều hình ảnh sử dụng PHP và MySQL. Bạn có thể dễ dàng tăng cường chức năng của tập lệnh này và sử dụng trong bất kỳ phần quản lý dữ liệu nào trong đó cần nhiều chức năng tải lên hình ảnh. Ví dụ về việc tải lên nhiều tệp và hình ảnh trong Codeigniter. Ví dụ về việc tải lên nhiều tệp và hình ảnh trong Codeigniter.. Làm thế nào tôi có thể tải lên hình ảnh trong PHP? Tạo biểu mẫu HTML. Chọn hình ảnh để tải lên:. Tải lên nhiều tệp trong PHP (Tải lên ..Bao gồm tệp cấu hình cơ sở dữ liệu để kết nối và chọn cơ sở dữ liệu MySQL ..Create an HTML form to select multiple images and files. Display multiple images preview before sending to server. Implement necessary validation before uploading. Save files in the local directory and store the uploaded file path in the database.
Làm thế nào có thể tải lên nhiều hình ảnh trong Codeigniter?Để tải lên nhiều tệp, chúng tôi sẽ sử dụng thư viện tải lên trong Codeigniter.Thư viện này sử dụng thư mục tải lên để lưu tất cả các tệp và hình ảnh ... Làm thế nào có thể tải lên nhiều hình ảnh trong Codeigniter? . . Ví dụ về việc tải lên nhiều tệp và hình ảnh trong Codeigniter. . . Làm thế nào tôi có thể tải lên hình ảnh trong PHP?Tạo biểu mẫu HTML.. . . . Chọn hình ảnh để tải lên:. . . . . |