File Upload với Progress bar
Bài viết sau sẽ hướng dẫn các bạn làm 1 trang upload file với thanh progress bar.
I. Introduction
Widget File upload sẽ hiển thị thời gian thực file upload bằng progress bar
II. Background
Nó sẽ cho phép user có thể upload, download, delete file mà không cần phải load lại trang
III. Using the code
Widget bao gồm
I. Introduction
Widget File upload sẽ hiển thị thời gian thực file upload bằng progress bar
II. Background
Nó sẽ cho phép user có thể upload, download, delete file mà không cần phải load lại trang
III. Using the code
Widget bao gồm
- Trang upload (Default.aspx)
- IFRAME chứa trang sử lý upload
- Một button upload (Cho phép user thực hiện upload file lên server)
- Khung hiển thị thông tin file upload( bao gồm tên file, trạng thái, tiến trình…)
- Grid (hiển thị danh sách file đã upload)
- Hidden field
- Upload Engine(UploadEngine.aspx)
- File Upload control
Default.aspx
UploadEngine.aspx
Trong khi load trang, nó sẽ đăng ký sự kiện cho nút Upload
UploadEngine.aspx
Trong khi load trang, nó sẽ đăng ký sự kiện cho nút Upload
- Chọn file Upload
- Click button upload (đăng ký sự kiện ở trên)
- Hiển thị tiến trình bằng thời gian thực
- Thực hiện cập nhật thông tin vào khung hiển thị
- Hai tiến trình sẽ thực hiện song song phía server
- Upload Engine
- Default
- Upload Engine
- Trong khi file đang upload thì thông tin của nó hiển thị như bên dưới
- 2 Hàm dưới đây thực hiện việc download và delete file
- Các trình duyệt hỗ trợ widget này
Chúc các bạn thành công
Cảm ơn bác vì bài viết hay. Em tìm bài về progressbar mãi.
Trả lờiXóa