Javascript/php parcourir

Discussion dans 'Web, design' créé par DeScH, 16 Juin 2007.

Statut de la discussion:
Fermée.
  1. Offline
    DeScH AstaLaVista
    Salut

    Je chercherai un petit script me permettant d'ajouter un bouton parcourir lorsque je clique sur un ptit bouton "+" par exemple (afin de ne pas devoir envoyer une par une des photos)
    DeScH, 16 Juin 2007
    #1
  2. Offline
    kokotchY Elite
    Je ne connais pas trop le javascript, mais je sais comment ca marche :p
    Tu auras un champ hidden avec le nombre de fichiers qui sont uploadés (<input type="hidden" name="nb" value="0">)
    i est une variable qui contient ce nombre.
    Dans le code du bouton +, tu fais :
    - ajouter un bouton parcourir avec un id
    en pseudo-code :
    i = i + 1
    div.add('<input type="file" name="file'+i+'" />');
    - ajoute 1 au nombre d'élément :
    inputhidden.value=inputhidden.value+1

    Après dans ta page php :
    Code:
    <?php
    $nb = $_POST['nb'];
    $file = array();
    for ($i = 1; $i <= $nb; $i++) 
    $file[$i] = $_FILES['file'.$i];
    Tu auras alors un tableau $file avec tous les fichiers uploadés !
    Je ne sais pas si c'est très clair :roll:
    kokotchY, 16 Juin 2007
    #2
  3. Offline
    Tifox ou pas
    Alors, pour l'upload multiple :
    http://www.asp-php.net/ressources/codes/PHP-Upload multiple.aspx

    Pour ajouter des champs dynamiquement :
    Les fonctions et var globale
    Code:
    var nbrInput = 1;
    function addInput() {
        var content = document.getElementById('inputContent');
    	var div = document.createElement('div');
    	div.id = 'inputdiv' + nbrInput;
    	content.appendChild(div);
    	div = document.getElementById('inputdiv' + nbrInput);
        var html = '<div id="inputdiv' + nbrInput + '">';
    	html += '<input name="fichier[]" type="file" id="input' + nbrInput + '" /> ';
    	html += '<input type="button" id="input' + nbrInput + 'button" onclick="removeInput(\'inputdiv' + nbrInput + '\'); return false;" value="Supprimer" />';
    	html += '<br  id="input' + nbrInput + 'br"/>';
    	html += '</div>';
    	div.innerHTML += html;
    	nbrInput++;
    }
    function removeInput(id) {
    	var inputdiv = document.getElementById(id);
    	inputdiv.parentNode.removeChild(inputdiv);
    }
    Et le formulaire
    Code:
    <form enctype="multipart/form-data" action="index.php" method="post">
    <div id="inputContent">
    	<div id="inputdiv0">
    		<input name="fichier[]" type="file" id="input0" />
    		<input type="button" id="input0button" onclick="removeInput(\'inputdiv0\'); return false;" value="Supprimer" /><br id="input0br" />
    	</div>
    </div>
    <input type="button" onclick="addInput();" value="Ajouter un champ" /><br />';
    <input type="submit" value="Ajouter la(les) photo(s) &agrave; l\'album" />';
    </form>
    Note que le script d'upload ne va pas directement avec avec le code javascript et le formulaire, il faut modifier un peu (le nom des vars, du fichier php appelé, ...). JE ne t'ai pas mis le script php que j'utilise, car il est beaucoup plus compliqué et fait plein de trucs annexes.

    Si tu as des questions, hésite pas
    Tifox, 16 Juin 2007
    #3
Statut de la discussion:
Fermée.