Comment gérer plusieurs téléchargements de fichiers avec PHP, jQuery et AJAX ?

Gestion du téléchargement de plusieurs fichiers avec PHP, jQuery et AJAX

Dans cet article, nous explorerons comment gérer efficacement le téléchargement de plusieurs fichiers à l'aide de PHP, jQuery et AJAX . Nous décomposerons le processus en trois étapes : préparer le formulaire, ajouter la fonctionnalité à l'aide de jQuery et traiter le téléchargement du fichier.

Préparer le formulaire

Commencez par créer un formulaire HTML qui comprend plusieurs boutons de navigation dans les fichiers. Chaque entrée de fichier doit avoir l'attribut name défini sur file[], indiquant qu'elle peut gérer un tableau de fichiers. Incluez un bouton pour la soumission du formulaire.

Ajout de la fonctionnalité jQuery

Exploitez jQuery pour ajouter la fonctionnalité permettant d'ajouter des boutons de navigation de fichiers supplémentaires. Implémentez un gestionnaire de clics pour le bouton "Ajouter plus de fichiers" qui ajoute dynamiquement de nouveaux éléments d'entrée de fichier au formulaire.

Traitement du téléchargement de fichier

Dans le script PHP, nous traitons le téléchargement du fichier. Utilisez une boucle pour parcourir chaque fichier du tableau $_FILES['file']. Le chemin cible du fichier téléchargé est généré de manière unique pour éviter les écrasements. Une fois le fichier déplacé vers le chemin cible, renvoyez un message de réussite ou d'erreur.

Soumission du formulaire à l'aide d'AJAX

Pour soumettre le formulaire via AJAX, utilisez ce qui suit code :

$('body').on('click', '#upload', function(e){
    e.preventDefault();
    var formData = new FormData($(this).parents('form')[0]);

    $.ajax({
        url: 'upload.php',
        type: 'POST',
        xhr: function() {
            var myXhr = $.ajaxSettings.xhr();
            return myXhr;
        },
        success: function (data) {
            alert("Data Uploaded: "+data);
        },
        data: formData,
        cache: false,
        contentType: false,
        processData: false
    });
    return false;
});

Cette fonction lie un gestionnaire de clic au bouton "Télécharger le fichier", crée un objet FormData contenant les données du formulaire, envoie une requête AJAX à upload.php, gère la réponse du serveur et empêche la soumission du formulaire par défaut.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!