Hướng dẫn cách Upload File Hàng Loạt Với Ajax Và PHP

Xem: 331    Tải: 0   Thảo luận: 0   Mục: Php&mySql   Lĩnh vực: Khác

8 điểm   ( 1 đánh giá ) File đã được kiểm thử

1 MEGA [megacode]huong-dan-cach-upload-file-hang.rar (26.32 KB)
Phí tải ~ 2,000 đ

Bạn cần phải Đăng nhập để tải file [megacode]huong-dan-cach-upload-file-hang.rar
Nếu bạn chưa có tài khoản thì Đăng ký miễn phí tại đây

Báo lỗi download   Báo vi phạm bản quyền

Hôm nay mình sẽ chia sẻ cho các bạn một bài viết về PHP và cách sử dụng Ajax với ứng dụng upload file. Với ứng dụng này các bạn có thể áp dụng vào trong các trang web của mình, ngoài ra các bạn có thể học và hiểu cách sử dụng Ajax, bài viết này rất hữu ích cho những bạn mới bước vào nghề web.

Tổng đài hỗ trợ KT: (+844) 6. 32.979.36 - Hotline: 0969.091.265
Hỗ trợ KT từ: 8h-17h30 các ngày trong tuần trừ chiều T7, CN và các ngày lễ;
Hỗ trợ kỹ thuật (KT) và cam kết chất lượng:
1. Code đảm bảo chất lượng giống demo 100%
2. Hỗ trợ cài đặt code cho khách hàng
3. Hỗ trợ hướng dẫn sử dụng cho khách hàng
Mega download: 1 MEGA = 2.000đ

Hôm nay mình sẽ chia sẻ cho các bạn một bài viết về PHP và cách sử dụng Ajax với ứng dụng upload file. Với ứng dụng này các bạn có thể áp dụng vào trong các trang web của mình, ngoài ra các bạn có thể học và hiểu cách sử dụng Ajax, bài viết này rất hữu ích cho những bạn mới bước vào nghề web.

HTML

Các bạn chỉ cần đoạn html như sau cho file upload :

<!-- Upload Button--> 
<div id="upload" >Upload File</div>
<span id="status" ></span>  
<!--List Files--> 
<ul id="files" ></ul>

CSS

Sau đó chúng ta sẽ định dạng đoạn html bên trên với vài dòng css bên dưới.

#upload{  
    margin:30px 200px; padding:15px;  
    font-weight:bold; font-size:1.3em;  
    font-family:Arial, Helvetica, sans-serif;  
    text-align:center;  
    background:#f2f2f2;  
    color:#3366cc;  
    border:1px solid #ccc;  
    width:150px;  
    cursor:pointer !important;  
    -moz-border-radius:5px; -webkit-border-radius:5px;  
}

PHP

Để upload file lên server, các bạn sẽ cần đoạn PHP sau :

<?php  
$uploaddir = './uploads/';   
$file = $uploaddir . basename($_FILES['uploadfile']['name']);   
    
if (move_uploaded_file($_FILES['uploadfile']['tmp_name'], $file)) {   
  echo "success";   
} else {  
    echo "error";  
}  
?>

JQuery

Cuối cùng là đoạn script cho phép chúng ta tạo hiệu ứng upload, đoạn script trên sẽ giúp chúng ta cho phép người dùng chỉ upload những file hình ảnh.

$(function(){  
    var btnUpload=$('#upload');  
    var status=$('#status');  
    new AjaxUpload(btnUpload, {  
        action: 'upload-file.php',  
        //Name of the file input box  
        name: 'uploadfile',  
        onSubmit: function(file, ext){  
            if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){   
                  // check for valid file extension   
                status.text('Only JPG, PNG or GIF files are allowed');  
                return false;  
            }  
            status.text('Uploading...');  
        },  
        onComplete: function(file, response){  
            //On completion clear the status  
            status.text('');  
            //Add uploaded file to list  
            if(response==="success"){  
                $('
<li></li>
 
').appendTo('#files').html('<img src="./uploads/'+file+'" alt="" />
'+file).addClass('success');  
            } else{  
                $('
<li></li>
 
').appendTo('#files').text(file).addClass('error');  
            }  
        }  
    });  
});

Thật đơn giản đúng không các bạn. Chúc các bạn thành công.

Hướng dẫn cách Upload File Hàng Loạt Với Ajax Và PHP

Hướng dẫn cách Upload File Hàng Loạt Với Ajax Và PHP Đăng ngày 27-09-2016  Hôm nay mình sẽ chia sẻ cho các bạn một bài viết về PHP và cách sử dụng Ajax với ứng dụng upload file. Với ứng dụng này các bạn có thể áp dụng vào trong các trang web của mình, ngoài ra các bạn có thể học và hiểu cách sử dụng Ajax, bài viết này rất hữu ích cho những bạn mới bước vào nghề web. 8/10 331

Thảo luận:

Để bình luận bạn phải đăng nhập thành viên.

File tương tự

Files cùng mục

 

File tải nhiều nhất

Megacode.vn - Thư viện mã nguồn chia sẻ, tải file cho cộng đồng
Copyright © 2013-2016. All rights reserved. Bản quyền thuộc VinaGon
Địa chỉ: Số 38 Hàng Bè, Hàng Bạc, Hoàn Kiếm, Hà Nội.
Văn phòng giao dịch: Phòng 28, Tầng 6, HH1A Linh Đàm, Hoàng Mai, Hà Nội
Email: info@vinagon.com | Website: www.vinagon.com | Điện thoại: (+844) 6. 32.979.36;
logo megacode

Megacode đã đăng ký với Bộ Công Thương
Thư viện mã nguồn mở lớn nhất Việt Nam.



Hỗ trợ khách hàng trên Megacode
Hỗ trợ kỹ thuật cho thành viên:
Tổng đài: (+844) 6. 32.979.36
Số di động (Hotline): 0969.091.265
Thời gian làm việc:
Sáng: 8h-12h; Chiều: 13h30-17h30
(Nghỉ chiều T7, CN và các ngày lễ, tết)
Chat với Megacode
https://www.facebook.com/megacodevn