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
Ce tag adauga imagine in pagina web?
<div> <img> <span>
<img src="http://coursesweb.net/imgs/webcourses.gif" width="191" height="63" alt="Courses-Web" />
Care din aceste coduri CSS afiseaza textul inclinat?
font-style: italic; text-decoration: underline; font-weight: 500;
#id {
  font-style: italic;
}
Clic pe functia jQuery care ascunde animat un element HTML.
click() hide() show()
$(document).ready(function() {
  $(".a_class").click(function(){ $(this).hide("slow"); });
});
Clic pe functia definita corect in PHP.
fname function() {} function fname() {} function $fname() {};
function fname($a, $b) {
  echo $a * $b;
}
Indicati forma pentru Prezent Perfect Continuu a verbului "to walk" (a merge).
have walked have been walking be walking
I have been walking for 5 hours.
- Merg pe jos de 5 ore.
Indicati Trecutul Nedefinit pentru verbul "ser" (a fi) la forma Yo.
será sería fui
Yo fui entrenador.
- Am fost antrenor.
Verificare tip fisier pentru upload

Last accessed pages

  1. Curs HTML gratuit Tutoriale HTML5 (188497)
  2. Verificare, Validare butoane radio si checkbox cu JavaScript (1169)
  3. Definire Variabile si Constante (6129)
  4. Tutoriale PHP (2231)
  5. Pozitionare elemente HTML cu CSS (4863)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (1260)
  2. Curs HTML gratuit Tutoriale HTML5 (966)
  3. Coduri pt culori (721)
  4. Creare si editare pagini HTML (567)
  5. Conditional IF in Limba Engleza - Fraze Conditionale (524)
Chat
Discuta sau lasa un mesaj pt. ceilalti utilizatori
Full screenInchide