Giriş
Web sayfalarında dosya yükleme sık karşılaşılan bir olaydır.Özellikle forum tipindeki sitelerde avatara kendi bilgisayarımızdan resim atarız ve ilgili kızımda görüntülenmesini sağlarız.Bunun nasıl yapıldığını incelemeye çalışalım...
Dosya Kaydı
Öncelikle sayfamıza dosyaları yükleyebilmemiz için gereken nesne yani FileUpload nesnesini yerleştirelim.bununla birlikte 1 adet buton ve 1 adet label yerleştirelim.label nesnesinin name özelliğini status olarak değiştirelim.Tasarımdaki butona ait kodlar aşağıdaki gibi olmalıdır.
Protected
SubButton1_Click(ByValsender As Object, ByVale AsSystem.EventArgs) HandlesButton1.Click
Dimbaglanti As NewOleDb.OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;Data Source="& Server.MapPath("~\App_Data\resimkayit.mdb"))
Dimfilename As String= FileUpload1.FileName
Dimsavepath As String= Server.MapPath("~\uploads\") 'resmin kayıt olacağı yer
Dimfile AsHttpPostedFile
IfFileUpload1.HasFile Then 'fileupload nesnesinden bir dosya seçilmiş ise...
file = FileUpload1.PostedFile
savepath += filename
'~\uploads\filename
FileUpload1.SaveAs(savepath)
status.Text =
"kayıt işlemi tamamlandı..."
savepath = filename
Dimcommand As NewOleDb.OleDbCommand("insert into resim(url) values('"+ savepath + "')", baglanti) baglanti.Open()
command.ExecuteReader()
baglanti.Close()
End If
End Sub
Kodlardan resimkayit isimli bir veritabanının olduğunu ve bu veritabanına ait resim tablosunun bulunduğunu anlamalıyız.ilk olarak ado .net komutlarıyla veritabanına bağlantıyı sağlıyoruz.Kodlama görüldüğü üzere 2 aşamadan oluşuyor.Birinci aşamada fileuploaddaki dosya belirlenen klasöre kayıt ediliyorken ikinci aşamada kayıt etmiş olduğumuz dosyanın ismini veritabanına kayıt ediyoruz.Veritabanına kayıt etmek daha sonra bu dosyayı ilgili nesnelerle(image) geri çağırmak açısından önemlidir.savepath = filename kodu ile dosyanın ismi veritabanına kayıt edilmiş olunur. Daha sonrada (birazdan inceleyeceğiz) html kodlamasında bunu veritabanından çağırırken tam fiziksel adresini belirtmiş oluruz.ve örneğin image nesnesinin ImageUrl özelliğinden bu dosyanın konumuna rahatca ulaşabiliriz.
NOT = Bu örnek için dosyaların kayıt edildiği yer olarak uploads klasörü belirlenmiştir.Siz herhangi bir klasör belirtebilirsiniz !
Resimleri Çağırma
Resimleri çağırmak için kullanacağımız en doğru nesne image nesnesi olacaktır.İmage nesnesini bir datalist içine(veya datagrid,repeater) atarsak veritabanından çağıracağımız bütün resimler sıralanacaktır. bunun için yine aynı sayfa üzerine bir adet datalist bir adet buton ve datalist içinede(yani ItemTamplete özelliğine) bir adet image nesnelerini yerleştirelim.Bunları yerleştirdikten sonra yeni eklemiş olduğumuz butonun kodları aşağıdaki gibi olmalıdır.
Protected
SubButton2_Click(ByValsender As Object, ByVale AsSystem.EventArgs) HandlesButton2.Click
Dimbaglanti As NewOleDb.OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;Data Source="& Server.MapPath("~\App_Data\resimkayit.mdb")) baglanti.Open()
Dimadap As NewOleDb.OleDbDataAdapter("select * from resim", baglanti)
Dimds As NewDataSet adap.Fill(ds,
"tablo") DataList1.DataSource = ds.Tables(0)
DataList1.DataBind()
baglanti.Close()
End Sub
Bu kodlar ile her veritabanı uygulamalarında olduğu gibi öncelikle veritabanına bağlantıyı cümlesini yazıyoruz.Sonra dataset ile aracı konumda olan adapter nesnesini çalışma zamanında oluşturduk.son aşamada ise verileri datasete ekledikten sonra bunu datalist ile ilişkilendirerek verilerin datalistte kullanabileceğini tamamlamış olduk.
Artık datalist içindeki nesneler aracılığı ile (bu uygulama için image nesnesi) veritabanından verileri çekmek mümkün hale geldi.Şimdi sıra html kodları kısmındaki image nesnesinin kodunu yazma geldi.Sayfanın Design yani tasarım aşamasından çkıp Source yani kaynağa ulaşalım.Bu kısımda DataList nesnesinin ItemTamplete tagını görmeliyiz.Bu tag aralığına image nesnesinin src kodunu yazmamız gerekece.Kodlama aşağıdaki gibi olmalıdır.
<
asp:DataList ID="DataList1" runat="server">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" src='<%# "uploads\" & (DataBinder.Eval(Container, "DataItem.url")) %>' /><br />
</ItemTemplate>
</asp:DataList>
Kodlardanda görüldüğü gibi image nesnesinin src (yani resim göster) kısmına dosyaları kayıt ettiğimiz klasörün ismini yani uploads'ı yazarak yanınada veritabanından gelecek olan dosyanın adını ekledik.Yani bir nevi şu şekilde oldu ...
src='...\veritabanına_resim\uploads\dosyaismi.uzantı) gibi ....
Bu son kısmıda bitirdiğimize göre Artık Hazırlamış olduğumuz sayfamız aracılığı ile resimlerimizi hem belirttiğimiz klasör içine kayıt edebiliyoruz hemde bu kayıt edilmiş olan resimlerimizi çağırabiliyoruz.
Makele ile ilgili her türlü soru ve eleştirilerinize açığım seviyeli olmak koşuluyla :) . . .
Makaleye ait örnek uygulamayı indirmek için tıklayın