JQUERY İle Dosya Yükleme

SessizCrew Web Programlama Kategorisinde 28 Tem 2009 | Yorum

Bu yazı 7 ay 14 gün önce yayınlanmış olduğundan güncelliğini yitirmiş veya içeriğindeki bilgilerin geçerliliği kaybolmuş olabilir. Herhangi bir yanlış anlaşılmadan bu site sorumlu değildir.

Bildiginiz gibi tek başına ajax veya jquery kullanarak dosya yükleme yapamıyoruz. Dosya yüklemeyi gerçekleştirmek için bir frame kullanmak zorundayız. Size benim de sık sık kullandıgım jqUploader uygulamasından bahsetmek istiyorum.

jqUploader

jqUploader listesini sunacagım uygulamalar arasında en kolay kullanabileceğimiz örnek. uygulamanın özelliklerini kısaca sayacak olursak.

Dosya boyutu kontrolü yapıyor

Yüklenecek dosyaların türünü belirleyebiliyoruz.

Entegrasyonu kolay.

Yükleme durumunu gösteren bir ilerleme göstergesi var.

Flash dosyası üzerinde değişiklikler yaparak site tasarımımıza uygun görünüm elde edebiliyoruz.

Nasıl Kullanacağız?

Genel olarak özelliklerini anlattıktan sonra gelelim uygulamayı nasıl sitemize entegre edeceğimize. İlk olarak jquery ve jquery flash dosyalarını ekleyerek işe başlıyoruz.

<script src="jquery-1.2.1.min.js" type="text/javascript"><!--mce:0--></script><script src="jquery.flash.js" type="text/javascript"><!--mce:1--></script><script src="jquery.jqUploader.js" type="text/javascript"><!--mce:2--></script>

İkinci adımımızda gerekli fonksiyonu ekliyoruz. Bu fonksiyon hakkında kısaca bilgi verecek olursak: #example kimliğine sahip div etiketimizde uygulmayı gösteriyoruz. afterScript: ile yükleme sonrası nereye yönlendirme yapacağımızı belirtiyoruz. allowedExt: ile uygulamanın kabul edeceği dosya türlerini belirtiyoruz.

$("#example2").jqUploader({		afterScript:	"redirected.php",		background:	"FFFFDF",		barColor:	"64A9F6",		allowedExt:     "*.avi; *.jpg; *.jpeg; *.png",		allowedExtDescr: "Images and movies (*.avi; *.jpg; *.jpeg; *.png)"	});

Son Olarak html kodlarını sayfamıza yerleştiriyoruz.

<form action="flash_upload.php" enctype="multipart/form-data" method="post">    <fieldset>    <legend>Upload your file</legend><ol>	<li id="example2">        <label for="example2_field">Choose a file to upload:</label><input id="example2_field" name="myFile2" type="file" /></li></ol></fieldset><input name="submit" type="submit" value="Upload File" />  </form>

Uyarılar

Kötü niyetli insanlardan korunmak için uygulamanın dosya türü kontrolü yapmasına aldanmayarak asıl olarak dosya yüklemesi yapan flash_upload.php dosyasından dosya türü kontrolü yapın.

Ayrıntılı Bilgi İçin | Demo

1 Yorum »

JQUERY İle Dosya Yükleme | SessizCrew.Com # Eğlenceli Web Projeleri Derki:

28 07 2009 Saat 03:40
[...] JQUERY İle Dosya Yükleme | SessizCrew.Com # Eğlenceli Web Projeleri Tags: flash, jquery-ile-dosya, kemal-sunal, mizah, nasl-kullanacaz, talat-cemre-can, teknoloji, upload, zmirli-fulya [...]

Bu yazıya yapılan yorumlar için RSS beslemeleri. Geri İzleme URL'si.