Acesta este un script de upload prin care pot fi incarcate mai multe fisiere in acelasi timp.
Scriptul foloseste JavaScript si PHP. Poate fi implementat si folosit atat in pagini HTML cat si PHP, dar serverul trebuie sa ruleze PHP.
Incarcarea fisierelor se face fara reincarcarea paginii, astfel, un eventual refresh nu va retrimite datele la server.

- Aici puteti vedea cum functioneaza. Este doar pt. test, in realitate nu va incarca nici un fisier pe server.

Testare



Adauga casuta upload

Scriptul e format doua fisiere principale: - Mai jos aveti codul pt. fiecare in parte

uploader.php

<?php
$updir = 'upload';    // Directorul pt. upload
$max_size = 500;      // Marimea maxima, in KiloBytes, care este permisa

// Seteaza matricea cu tipurile de fisiere permise
$allowtype = array('bmp', 'flv', 'gif', 'jpg', 'jpeg', 'mp3', 'pdf', 'png', 'rar', 'zip');

// Creaza directorul din $updir (cu CHMOD 077), daca nu exista
if(!is_dir($updir)) mkdir($updir, 0777);

/** Incarcarea imaginii pe server **/

$rezultat = array();
// Daca este primit din formular un fisier valid
if(isset ($_FILES['file_up'])){
  // Seteaza pt. upload fisierele primite (pot fi primite din mai multe campuri 'file_up')
  for($f=0; $f<count($_FILES['file_up']['name']); $f++){
    // Verifica daca fisierul are tipul de extensie permis
    $ar_ext = explode(".", strtolower($_FILES['file_up']['name'][$f]));
    $type = end($ar_ext);
    if(in_array($type, $allowtype)){
      // Verifica daca fisierul are marimea permisa
      if($_FILES['file_up']['size'][$f]<=$max_size*1000){
        // Daca nu sunt erori in procesul de copiere
        if($_FILES['file_up']['error'][$f]==0){
        // Seteaza locatia si numele pt. incarcare pe server
          $thefile = $updir . "/" . $_FILES['file_up']['name'][$f];
          // Daca fisierul nu poate fi incarcat, returneaza mesaj
          if(!move_uploaded_file ($_FILES['file_up']['tmp_name'][$f], $thefile)) $rezultat[$f] = ' Fisierul nu a putut fi copiat, incercati din nou';
          else $rezultat[$f] = '<b>'.$_FILES['file_up']['name'][$f].'</b>';  // Retine numele fisierului incarcat
        }
      }
    else { $rezultat[$f] = 'Fisierul <b>'. $_FILES['file_up']['name'][$f]. '</b> depaseste marimea permisa de maxim <i>'. $max_size. 'KB</i>'; }
    }
    else { $rezultat[$f] = 'Fisierul <b>'. $_FILES['file_up']['name'][$f]. '</b> nu are tipul de extensie permis'; }
  }

   // Returneaza rezultatul
  $rezultat2 = implode('<br> ', $rezultat);
  echo '<h4>Fisiere incarcate:</h4>'.$rezultat2;
}

upload.js

// Functia care adauga o noua casuta de upload in formular
function add_upload(form_id){
  // Elementul inaintea caruia e adaugat cel nou
  var element = document.getElementById('sub');

  // Creaza elementul nou <input>, si atributele lui
  var new_el = document.createElement('input');
  new_el.setAttribute('type', 'file');
  new_el.setAttribute('name', 'file_up[]');
  document.getElementById(form_id).insertBefore(new_el, element);
}

// Functia care trimite datele din formular, fiind transferate la iframe
function uploading(theform){
  // Adauga codul cu iframe-ul
  document.getElementById('ifrm').innerHTML = '<iframe id="uploadframe" name="uploadframe" src="uploader.php" frameborder="0"></iframe>';

  theform.submit();    // Executa trimiterea datelor

  // Reinoeste formularul
  document.getElementById('uploadform').innerHTML = '<input type="file" id="test" class="file_up" name="file_up[]" /><input type="submit" value="UPLOAD" id="sub" />';
  return false;
}

- Mod de utilizare

- Creati cele doua fisiere de mai sus pe server (cu numele si codul date mai sus), in acelasi director unde se afla pagina (.html sau .php) in care doriti sa folositi scriptul.
- In pagina respectiva adaugati urmatorul cod (in locul unde doriti sa apara formularul pt. upload):
<div id="ifrm"> </div>
<form id="uploadform" action="uploader.php" method="post" enctype="multipart/form-data" target="uploadframe" onsubmit="uploading(this); return false">
  <input type="file" class="file_up" name="file_up[]" />
  <input type="submit" value="UPLOAD" id="sub" />
</form>
<script type="text/javascript" src="upload.js"></script>
<a href="#" onclick="add_upload('uploadform'); return false;" title="Adauga element nou">Adauga casuta upload</a>

- Pentru a fi afisate unele sub altele casutele de upload din formular, adaugati in pagin urmatorul cod CSS, in sectiunea HEAD:
<style type="text/css">
#uploadform input {
  display:block; 
  margin:3px auto;
}
</style>

Precizari:

- Directorul in care sunt incarcate fisierele are denumirea "upload" (poate fi modificata din "uploader.php", variabila "$updir") si scriptul e construit sa creeze singur acest director, daca PHP are permisiunea de creare directoare pe server. Daca nu poate crea directorul, sau dupa ce l-a creat nu i-a setat CHMOD 0777 si afiseaza o eroare ca fisierul nu a putut fi incarcat, trebuie sa-l creati manual, cu denumirea upload (in acelasi loc in care ati copiat fisierele scriptului) sau /si sa setati CHMOD 0777.
- Tipul fisierelor permise pentru upload (extensia lor) poate fi modificat din variabila "$allowtype"
- Marimea fisierelor, in KiloBytes, permisa pt. upload poate fi modificata la variabila "$max_size", initial 500 KB (Marimea maxima a fisierelor care pot fi transferate depinde si de setarile facute in configurarea serverului)
- Daca incarcati fisiere care au aceasi denumire si extensie cu altele deja incarcate, cele noi le vor suprascrie (inlocui) pe cele vechi.

In arhiva pe care o puteti descarca de la Download (din partea dreapta-sus a paginii) gasiti scriptul complet si un fisier de test dupa care sa va ghidati sau sa-l folositi pe server.

Scriptul este gratuit, il pteti modifica si folosi dupa cum doriti.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Care tag defineste zona de click intr-o harta creata dintr-o imagine?
<map> <img> <area>
<img src="image.jpg" usemap="#map1">
<map name="map1">
  <area shape="rect" coords="9, 120, 56, 149" href="#">
  <area shape="rect" coords="100, 200, 156, 249" href="#">
</map>
Ce proprietate CSS indica ce sa se intample cand continutul unui element depaseste dimensiunile lui?
display overflow position
#id {
  overflow: auto;
}
Clic pe evenimentul care este declansat cand mouse-ul e deasupra unui obiect.
onclick onmouseover onmouseout
document.getElementById("id").onmouseover = function(){
  document.write("Sa ai Viata Buna");
}
Indicati variabila PHP ce contine datele adaugate in adresa URL, dupa caracterul "?".
$_SESSION $_GET $_POST
if(isset($_GET["id"])) {
  echo $_GET["id"];
}
Clic pe pronumele reflexiv care e potrivit in propozitia: "Marc is the boy ... won the prize".
who which whoever
Marc is the boy who won the prize.
- Marc e baiatul care a castigat premiul.
Clic pe pronumele reflexiv care e potrivit in propozitia: "Voy a ver al pintor de ... les hablé ayer".
que quien cuyo
Voy a ver al pintor de quien les hablé ayer.
- Ma duc sa vad pictorul despre care ti-am vorbit ieri.
Script Multi-Uploader

Last accessed pages

  1. Verbe modale - Modal verbs - CAN, COULD, MAY, MIGHT, MUST (27381)
  2. Zilele saptamanii - Lunile anului - Anotimpurile - Engleza (10611)
  3. Verbe frazale din limba Engleza (15272)
  4. Jokes - Glume, Bancuri, Humor (3661)
  5. Zilele saptamanii, Lunile si Anotimpuri - Exercitii incepatori (3195)

Popular pages this month

  1. Prezentul simplu si continuu - Present Tense Simple and Continuous (3644)
  2. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (3243)
  3. Gramatica limbii engleze - Prezentare Generala (2719)
  4. Prezent perfect si Prezent perfect continuu - Present perfect and Continuous (2361)
  5. Trecutul simplu si continuu - Past Tense Simple and Continuous (1955)