Turning gears are the logo of co-scripts

Dosyaları sunucuya aktarmak için http üzerinden form aracılığıyla dosyayı sunucuya bildiririz, sunucu dosyayı bir anlamda download eder. Bunu bir input tipi olan file ile bildiririz. Son browser sürümlerinde file tipi çoklu dosya seçimine destek verecek şekilde multiple metodunu kabul etti. Standardı üzerinde halâ farklılıklar olsa da şuan tüm browserlarda çalışıyor.

<input type="file" multiple=""> dediğinizde dosya seçme diyalog kutusunda birden çok dosyayı fare ile veya ctrl tuşuna basık tutarak seçebiliyoruz. Peki seçince input bunları nasıl gösteriyor. Dosya adreslerini virgüllerle ayrılmış bir dizi olarak gösteriyor.

Bu dizideki dosyalar yeraldıkları sıra ile sunucu tarafından download ediliyorlar. Yani upload ediyoruz. Peki bu arada biz bu dosya isimlerini görmek ve bir takım başka işlemler yapmak istersek ne olacak?

Öncelikle input elementine bir id vermiş olmamız gerek (ele almanın en kolay yolu olduğundan). Diyelim input elementi idsi secilenler olsun. Ve çoklu seçim yaptığımızı varsayalım, diyalog kutusundan.

Tüm dosyalarımız document.getElementById('secilenler').files şeklinde bir dizi olarak ele alabiliriz. Daha sonra bunları bir döngüden geçirip tek tek dosyaların bilgilerine ulaşabiliriz.

dosyalar = document.getElementById('secilenler').files;

dosyaSayisi = document.getElementById('secilenler').files.length;

for(ds=0;ds < dosyaSayisi; ds++)

{

alert(dosyalar[ds].name);  // bazı browserlarda  .name yerine .fileName kullanılır, ternary operatörü tam buraya göre

}

Benzer şekillerde şu özelliklerini elde edebiliyoruz dosyaların

dosyalar[ds].fileSize;

dosyalar[ds].size;

dosyalar[ds].mediaType;

Dosyanın uzantısına ise şu şekilde ulaşabilirsiniz

var dosyaTipi = dosyalar[ds].name.split('.').pop(); // Böylece izin verilmeyen dosya varmı kontrol edersiniz. Bunun için dosya uzantılarının bulunduğu bir dizide sizin uzantı varmı buna bakabilirsiniz. Bir dizide elimizdeki metinin olup olmadığını kontrol eden betiği de şuradan bulabilirsiniz.

Üzerinde çalıştığım bir upload uygulamasını yakın zamanda paylaşırım.

co-scripts tag image
ID:236 | Okunma:2870