ASP.net ile Resim Upload Uygulaması ve User Control kullanılarak başka sayafalarda da kullanmak


Merhaba.

Bugün ASP.net ile birlikte tanıştığımız  User Control leri inceleyip bir de örnek uygulama geliştiriyor olacağız .
    User Controller  aslında klasik asp ya da php de kullanılan include edilen sayfalara  benzeyen yapılardır. Örneğin  sitemizin sol tarafında ki linkeleri ayrı bir sayfa olarak tasarlayıp sonra istediğimz sayfanın içine sürükleyip bırakabiliriz. Böylece her sayfada tekraradan kod yazmak ya da kodları kopy-paste yapmaktan kurtulmuş oluruz. User contollerin uzantıları ascx olur ve tek başına çalıştırılamazlar, sadece  .aspx  sayfalarının içerinde çalıştırılabilirler.  İlk olarak User Control ü projrmize nasıl ekleriz ona bakalım .   Projrmizin üstüne sağ tıklayıp Add New Item  seçeneğine tıkladıktan sonra  çıkan ekrandan Web User Control ü seçip Add  diyoruz. Oluşturduğumuz User Control ün source tarafındaki  kodlarına bakacak olursak  <html> <body><head> vb. hiçbir kodun omadığnı görürüz, bunun sebebi de User Contrllerin başka bis sayfa içerinde çalışıyor olmasıdır.

  Şimdi lafı fazla uzatmadan örnek bir uygulama ile konuyu daha iyi anlamaya çalışalım. 
Örnek uygulamamızda klasik yönetemle yapışan File Upload işlemini bir Web User Control ile yapyor olacağız. Bunun avantajı ne olacak peki ?  Örneğin bir site yapıyoruz ve bu sitenin çeşitli sayfalarında sürekli resim upload etmemiz gerekiyor  klasik  yolla yapmış olsak her sayfaya önce bir resim upload forum tasarlamamız gerekecek, tasarladığımız bu formun  kodlarınıda baştan yazmamız gerekecek  ya da  önceden yapılan upload kodunu copy –paste yapıp asıl saymızın içerindeki butonun Click eventinin içerisine koymamız gerekecekti  (uzun iş).  Web User Control ile yaptığmız zaman ise yapmamız gereken tek şey User Contolümüzü isediğimiz  .aspx sayfasının isteğimiz yerine sürükleyip bırakmak. 

   İlk olarak sayafmıza Upload adında  bir adet Web User Control ekleyelim  ve sayfamzı aşağıdaki gibi tasarlayalım.

Upload.ascx

<style type="text/css">

    .style1

    {

        width: 500px;

        float: left;

    }

</style>

<table align="center" cellpadding="2" class="style1">

    <tr>

        <td>

            Resim

        </td>

        <td>

            :</td>

        <td>

            <asp:FileUpload ID="FileUpload1" runat="server" />

            <asp:Label ID="lblDurum" runat="server" ForeColor="#CC3300"></asp:Label>

        </td>

    </tr>

    <tr>

        <td>

            &nbsp;</td>

        <td>

            &nbsp;</td>

        <td>

            <asp:Button ID="Button1" runat="server" Text="Resmi Yükle" Width="105px" />

        </td>

    </tr>

</table>

Upload.ascx Sayfamızın görünümü ağıdaki gibi olacaktır .

 

 

Şimdi de User controlün Upload koduna geçelim . Resim yükle butınuna çift tıklayıp aşağıdaki  kodu ekleyelim yani Upload kodu .


Upload.ascx.cs

protected void Button1_Click(object sender, EventArgs e)

    {

        if (FileUpload1.HasFile)

        {

            FileUpload1.SaveAs(Server.MapPath("~/Images/"+FileUpload1.FileName));

            lblDurum.Text = "Resim Yüklendi";

 

        }

    }

 

   Genel olarak işlem bundan ibaret . Artık bu User contolü Defalut.aspx sayfası Design modundayken sayfanın herhangi bir yerine Upload.asxc User Contolünü sürükleyip  bırakalım  ve Defaılt.aspx çalıştırdırıp test edersek Upload işleminin gerçeklerştiğini görebiliriz.

   Şimdi bana şunu diyebilirsiniz ;  İyi de  kardeşim ben isteğim her sayfada resim upload ediyorum iyi hoş ama her yerde Images klasörüne Uplaod etmek  istemiyorum belki  ? Örneğin foto galeri için Images klasörüne ,  haberler için olan resimleri ise Haber_Images klasörüne Upload etmek istiyorum.
 
  Ozaman User Contolümüzün kodunda ufak bir değişiklik yapıp
Server.MapPath("~/Images/"+FileUpload1.FileName) alanındaki  klasör adının dışarıdan ulaşılabilir ve değiştirilebilir yapmamız  gerekiyor.    Yani değişken şeklinde yapıp bu değişkene dışarıdan ulaşabilmeliyiz.    Bunun için User Control sayfamızın başına private string klasor;

 şeklinde Private bir değişken tanımlayıp bu değişken Property yazalım   ve upload işleminde kalsör adı yerine bu değişkeni kullanalım.
   
Yani Upload.ascx.cs nin son hali aşağıdaki gibi olacak .
Not : Değşken ve Property i  Page_load ya da başka bir yere yazmayın direk sayafnın ana classının içerise yazın , örneğin buton_click eventinin hemen üzerine .

Upload.ascx.cs

private string klasor;

 

    public string Klasor

    {

        get { return klasor; }

        set { klasor = value; }

    }

    protected void Button1_Click(object sender, EventArgs e)

    {

        if (FileUpload1.HasFile)

        {

            FileUpload1.SaveAs(Server.MapPath(klasor+FileUpload1.FileName));

            lblDurum.Text = "Resim Yüklendi";

 

        }

    }

Şimdi ise yapmamız gereken tek şey bu user conrolü kullandığımız sayfanın ilk yüklenmesi esnasında klasör adını User Contol içindeki Klasor değişkenine set etmek.  Default.aspx sayfamızın Load eventine aşağıdaki kodu ekleyelim.

Default.aspx.cs
protected void Page_Load(object sender, EventArgs e)

    {

        Upload1.Klasor = "~/Haber_Images/";

    }

Artık buradaki verilen yol değiştiğinde resimlerin upload edileceği yol da değişektir. Örneğin yukarıdaki gibi yazılınca resimler Haber_Images klasörüne  , Images yazılınca da Images klasörüen yüklenecek.

 

 

Kolay Gelsin

 

 

 

Bunu beğen
Paylaş

Yorumlar
Yorum Yaz
İsim : (*)
E-mail :
Web Adresi:
:
(*)
 
Kapat