Curs Javascript

Script-ul JavaScript din acest tutorial verifica numele (extensia) fisierului adaugat intr-un formular pentru upload.
Puteti adauga /sterge lista de extensii permise in variabila "ar_ext" din script.
Acest script separa numele si extensia fisierului si adauga numele intr-un camp text.
Daca extensia fisierului este in lista permisa, activeaza butonul "Submit", altfel, sterge valoarea din campul "file", dezactiveaza butonul "Submit" si afiseaza o fereastra Alert.
<form action="upload.php" method="post" id="idf" enctype="multipart/form-data">
 Upload file: <input type="file" name="fup" onchange="checkName(this, 'fname', 'submit')" /><br />
 File name: <input type="text" value="" name="denumire" id="fname" /><br />
 <input type="submit" name="submit" id="submit" value="Submit" disabled="disabled" />
</form>
<script type="text/javascript"><!--
var ar_ext = ['pdf', 'gif', 'jpe', 'jpg'];        // array cu extensiile permise

function checkName(el, to, sbm) {
// - marplo.net
  // preia numele fisierului si separa nume si extensia
  var name = el.value;
  var ar_name = name.split('.');

  // pt. IE - separa directoarele (\) de nume
  var ar_nm = ar_name[0].split('\\');
  for(var i=0; i<ar_nm.length; i++) var nm = ar_nm[i];

  // adauga numele in 'to'
  document.getElementById(to).value = nm;

  // verifica extensia
  var re = 0;
  for(var i=0; i<ar_ext.length; i++) {
    if(ar_ext[i] == ar_name[1]) {
      re = 1;
      break;
    }
  }

  // daca re are valoarea 1, extensia este in list permisa
  if(re==1) {
    // activeaza submit
    document.getElementById(sbm).disabled = false;
  }
  else {
    // sterge numele fisierului, dezactiveaza Submit, afiseaza Alert
    el.value = '';
    document.getElementById(sbm).disabled = true;
    alert('".'+ ar_name[1]+ '" nu este un tip de fisier permis');
  }
}
--></script>
Fisierul "upload.php" trebuie sa contina un script PHP care sa preia si sa copieze fisierul pe server. Mai jos este script-ul pentru "upload.php".

Cod upload.php

<?php 
// Script de la https://marplo.net/ (Transfera fisiere pe server)

// 1. Creati intai directorul cu numele 'uploads' (in acelasi director cu pagina dv. de upload) in care se vor copia fisierele
// 2. Acordati directorului 'uploads' permisiuni CHMOD 0777
// 3. introduceti tot acest cod intr-un fisier .php 

// Aici puteti modifica numele directorului de upload (daca ati pus alt nume)
$uploadpath = "uploads/";

// Aici este setata marimea maxima, in KiloBytes, care este permisa (dar marime maxima depinde si de setarile serverului)
$max_size = 500;

// Aici puteti schimba tipul, extensia fisierelor permise pt. upload
$allowtype = array('pdf', 'gif', 'jpg', 'jpe');

if(isset($_POST['submit'])) {
  if (isset ($_FILES['fup'])) {
    $uploadpath = $uploadpath . basename( $_FILES['fup']['name']);
	$type = end(explode(".", strtolower($_FILES['fup']['name'])));

    // Daca fisierul are extensia permisa
    if (in_array($type, $allowtype)) {
	  // Verifica daca fisierul are marimea permisa
	  if ($_FILES['fup']['size']<=$max_size*1000) {
        if(move_uploaded_file($_FILES['fup']['tmp_name'], $uploadpath)) { 
          echo "Fisierul:<b> ". basename( $_FILES['fup']['name']). "</b> a fost incarcat cu succes:"; 
          echo "<br />Tipul fisieului:<b> ". $_FILES['fup']['type'] ."</b>"; 
          echo "<br />Marime  (<i>in Bytes</i>): <b>". $_FILES['fup']['size'] ."</b><br /><br />";
		  echo 'Link catre fisierul incarcat: <b>http://'.$_SERVER['HTTP_HOST'].dirname($_SERVER['REQUEST_URI']).'/'.$uploadpath.'</b>';
        }
        else { 
          echo "<b>A aparut o eroare la urcarea fisierului pe server, <br /> posibil ca marimea fisierului sa depaseasca permisiunile setate de server.</b>"; 
        }
	  }
	  else { echo 'Fisierul <b>'. $_FILES['fup']['name']. '</b> depaseste marimea permisa de maxim <i><b>'. $max_size. 'KB</b></i>'; }
    }
	else { echo 'Fisierul <b>'. $_FILES['fup']['name']. '</b> nu are tipul de extensie permis'; }
  }
}
?>

Puteti testa script-ul JavaScript cu formularul urmator (tipuri permise: PDF, GIF, JPE, and JPG):
Upload file:
File name:

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.
Verificare tip fisier pentru upload

Last accessed pages

  1. Expresii uzuale din Limba Spaniola (O-Y) (2704)
  2. Fraze conditionale (966)
  3. Cursuri limba engleza gratuite si lectii online (67643)
  4. Viitorul - Verbul la viitor (6664)
  5. Animatie elemente HTML cu CSS (3410)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (372)
  2. Gramatica limbii engleze - Prezentare Generala (212)
  3. Gramatica limbii spaniole. Indrumator si prezentare generala (165)
  4. Coduri pt culori (157)
  5. Cursuri limba engleza gratuite si lectii online (139)