Upload Multiple Files with PHP and JQuery

by

Index.html

<html>
    <head>
        <title>Load files</title>
        <script src="https://stackoverflow.com/questions/24168040/jquery.min.js"></script>
        <script type="text/javascript">

            $(document).ready(function() {
                $('#myfiles').on("change", function() {
                    var myfiles = document.getElementById("myfiles");
                    var files = myfiles.files;
                    var data = new FormData();

                    for (i = 0; i < files.length; i++) {
                        data.append('file' + i, files[i]);
                    }

                    $.ajax({
                        url: 'load.php', 
                        type: 'POST',
                        contentType: false,
                        data: data,
                        processData: false,
                        cache: false
                    }).done(function(msg) {
                        $("#loadedfiles").append(msg);
                    });
                });



            });
        </script>
    </head>
    <body>

        <div id="upload">
            <div class="fileContainer">
                <input id="myfiles" type="file" name="myfiles[]" multiple="multiple" />
            </div>
        </div>
        <div id="loadedfiles">

        </div>
    </body>
</html>

load.php

<?php
    $path="myfiles/";//server path
    foreach ($_FILES as $key) {
        if($key['error'] == UPLOAD_ERR_OK ){
            $name = $key['name'];
            $temp = $key['tmp_name'];
            $size= ($key['size'] / 1000)."Kb";
            move_uploaded_file($temp, $path . $name);
            echo "
                <div>
                    <h12><strong>File Name: $name</strong></h2><br />
                    <h12><strong>Size: $size</strong></h2><br />
                    <hr>
                </div>
                ";
        }else{
            echo $key['error'];
        }
    }
?>

More Related Contents:

  1. How to inject javascript code that uses php variables into php page
  2. I want to use jquery nested sortable plugin with drag and drop in codeigniter using mysqli
  3. How do I run ajax request in background continuously?
  4. AJAX request callback using jQuery
  5. using jquery $.ajax to call a PHP function
  6. Ajax Upload image
  7. How do I close a connection early?
  8. How to get the jQuery $.ajax error response text?
  9. Passing JavaScript array to PHP through jQuery $.ajax
  10. Send array with Ajax to PHP script
  11. jQuery – Call ajax every 10 seconds
  12. Creating jQuery AJAX requests to a PHP function
  13. PHP/Apache/AJAX – POST limit?
  14. Update fee dynamically based on radio buttons in Woocommerce checkout
  15. jQuery AJAX form using mail() PHP script sends email, but POST data from HTML form is undefined
  16. Redirect with PHP after ajax call
  17. jquery using ajax to send data and save in php [duplicate]
  18. Sending multiple data parameters with jQuery AJAX
  19. jQuery $.ajax request of dataType json will not retrieve data from PHP script
  20. Refresh a table with jQuery/Ajax every 5 seconds
  21. Using AJAX to pass variable to PHP and retrieve those using AJAX again
  22. How to pass an array using PHP & Ajax to Javascript?
  23. How to make a Cascading Drop Down List in PHP using jQuery
  24. Jquery ajax setTimeout after form succes not redirecting?
  25. AJAX only access
  26. Codeigniter CSRF valid for only one time ajax request
  27. PHP + Ajax Login
  28. Add a quantity field to Ajax add to cart button on WooCommerce shop page
  29. PhP Upload progress in PhP 5.4 is not working. Session variables not set
  30. How to Load Ajax in WordPress

Leave a Comment