Récupérer img drag & drop

slimart
PHP

Bonjour a tous,

Je voudrais récupérer une image droper dans une div, je m'explique, j'ai une div qui sert de drop zone pour y glisser/déposer un fichier (image) et je voudrais simplement récupéré cette image et l'uploader sur mon serveur.

En créant un input "file" c'est simple mais la je ne peux pas utiliser d'input car j'ai un certain design a appliquer sur la div qui serai impossible sur un input.

Grossièrement je voudrais appliquer cette div a ce morceau de php :

if (isset($_FILES['monfichier1']) AND $_FILES['monfichier1']['error'] == 0)
    {

            if ($_FILES['monfichier1']['size'] <= 1000000)
            {

                    $infosfichier = pathinfo($_FILES['monfichier1']['name']);
                    $extension_upload = $infosfichier['extension'];
                    $extensions_autorisees = array('jpg', 'jpeg', 'png');
                    if (in_array($extension_upload, $extensions_autorisees))
                    {

                            $folder = $nom . '-' . $email . '-' . time();
                            mkdir("$folder", 0777, true);

                            move_uploaded_file($_FILES['monfichier1']['tmp_name'], "$folder/" . basename($_FILES['monfichier1']['name']));
                            echo "Screen 1 bien envoyé";
                    }
            }
    }

1 réponse

Benjamin Derepas

En créant un input "file" c'est simple mais la je ne peux pas utiliser d'input car j'ai un certain design a appliquer sur la div qui serai impossible sur un input.

Je ne vois pas bien ou est le problème ... tu peux créer un input file, et jouer sur les pseudo selecteur :after (par exemple) pour le styliser.

Pour ce qui est de l'upload, tu dois utiliser Ajax, cependant je te conseil d'utiliser un plugin tout fait , comme DropZone .
Ton code sera tout simple alors : 

var myDropzone = new Dropzone("div#myId", { url: "/file/post"});