8 Aralık 2011 Perşembe

ASP.NET UpdateProgress Kontrol

   Son zamanlarda internette sıkça "yükleniyor..." şeklinde mesajlar veya sayfanın yüklendiğini gösteren hareket eden görsel resimler görmeye başladık. Web sitesini görsel açıdan zenginleştiren, aynı zamanda da kullanıcı beklerken sıkılmasını önleyen bu tip uygulamaları siz de UpdateProgress kullanarak yapabilirsiniz.   

   UpdateProgress kontrolü UpdatePanel ile birlikte kullanılan bir kontroldür. Öncelikte sayfanıza bir ScriptManager eklemelisiniz. (Mümkünse sayfanın en üstüne ekleyiniz. Aksi taktirde hata mesajı verebiliyor.) Bir UpdatePanel, UpdateProgress ve bir buton ekliyoruz. 


UpdateProgressKontrolKullan.aspx


<asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:Button ID="ButtonUpdateProgress" runat="server" OnClick="ButtonUpdateProgress_Click"
                    Text="Yükle" />
                <br />
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
            <ProgressTemplate>
                <asp:Image ID="Image1" runat="server" ImageUrl="~/Resimler/ajax-loader.gif" />
            </ProgressTemplate>
        </asp:UpdateProgress>
        <br />
        <asp:Label ID="Label1" runat="server" Text="Yükleniyor..."></asp:Label>
        <br />
        <asp:UpdatePanel ID="UpdatePanel2" runat="server">
            <ContentTemplate>
                <asp:Button ID="ButtonGonder" runat="server" OnClick="ButtonGonder_Click" Text="Gönder" />
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2"
            DisplayAfter="2000" DynamicLayout="False">
        </asp:UpdateProgress>

UpdateProgressKontrolKullan.aspx.cs



protected void Page_Load(object sender, EventArgs e)
        {
            UpdateProgress2.Controls.Add(Label1); 


 /* Programatik olarak UpdateProgress kontrolüne değer atıyorum. 

UpdateProgress2 kontrolünün içerisine yerleştirerek de yapabilirsiniz.


Bu işlemin aynısını tasarım aş
amasındayken de yapabilirsiniz. */

        }
       

        protected void ButtonGonder_Click(object sender, EventArgs e)
        {
         
            System.Threading.Thread.Sleep(5000);  
 
/* Butona tıkladığımda UpdateProgress kontrolünün içeriğinin gözükmesi i
çin bir ifade yazıyorum. 5000 ms = 1 s süresince UpdateProgress kontrolüm
 gözükecek */
        }



   Yukarıdaki kodlarımıza şöyle bir göz atalım. Butonumuza tıkladığımızda 5000 ms yani 5 saniye boyunca ajax-loader.gif simgemiz gözükecek, ardından da kaybolacak. Normalde System.Threading.Thread.Sleep(5000);     gibi bir ifade yazmamıza gerek yok. UpdatePanel güncelleme yaptığında zaten UpdateProgress kontrolü çalışacak ve ilgili resim gösterilecektir. Biz burada uygulamamızın sonuçlarını hemen görebilmek için böyle bir yola başvurduk. Bu arada resim yerine "Yükleniyor..." şeklinde bir yazı da koyabilmeniz mümkün.


Şimdi gelelim UpdateProgress kontrolünün özelliklerine:


  •  AssociatedUpdatePanelID - Eğer sayfanızda birden fazla UpdateProgress veya UpdatePanel kullanıyorsanız bu özellik işinize yarayabilir. Buradan hangi UpdatePanel güncelleme yaptığında UpdateProgress'in gösterilmesi istiyorsanız ilgili UpdatePanel'in ID değerini yazıyorsunuz. Eğer herhangi bir değer yazmazsanız sayfanızdaki herhangi bir UpdatePanel güncelleme yaptığında gözükecektir.
  • DiplayAfter - Bu özellik milisaniye cinsinden sayısal değer alıyor. Varsayılan değeri 500(yani 0,5 saniye) Belirlenen süre sonra UpdateProgress gösterilmeye başlıyor. Kısa sürecek işlemlerde UpdateProgress'in gösterilmesini istemiyorsanız kullanabilirsiniz.
Örnek uygulamayı görmek için tıklayınız.


Alternatif Bağlantı

6 Aralık 2011 Salı

Asp.net Ajax CascadingDropDown

   CascadingDropDown  bir ASP.NET DropDownList kontrolüyle ilişkilendirilerek kullanılan bir AJAX extender türüdür. DropDownList içerisindeki değerleri adeta bir süzgeç süzer. Genellikle birden fazla DropDownList bir arada kullanılır. Seçilen bir değer diğer kontrolü etkiler. 

   Örneğin il, ilçe ve semt bilgilerini 3 tane DropDownList ve ilişkilendirilmiş CascadingDropDown kontrolleriyle kullandığımızı varsayalım. İl alanını seçtiğimizde ilçe alanında sadece o ile ait ilçeler gösterilecektir. Aynı şekilde ilçe değerini seçtiğimizde de o ilçeye ait semtler gösterilecektir. Yani bir filtreleme söz konusu.

   İl, ilçe ve semt bilgilerini filtrelenerek gösterildiği bir örnek üzerinden gidelim:


 İl :&nbsp;
        <asp:DropDownList ID="DropDownListIl" runat="server">
        </asp:DropDownList>
        <asp:CascadingDropDown ID="DropDownListIl_CascadingDropDown" runat="server" 
            Category="il" Enabled="True" ServicePath="ilIlceSemt.asmx" ServiceMethod="Getil" LoadingText="iller yükleniyor..." 
            PromptText="Lütfen bir il seçiniz..." TargetControlID="DropDownListIl">
        </asp:CascadingDropDown>
        <br />
        <br />
        İlçe :
        <asp:DropDownList ID="DropDownListIlce" runat="server">
        </asp:DropDownList>
        <asp:CascadingDropDown ID="DropDownListIlce_CascadingDropDown" runat="server" 
            Category="ilce" Enabled="True" LoadingText="ilçeler yükleniyor..." 
            ParentControlID="DropDownListIl" PromptText="Lütfen bir ilçe seçiniz..." 
            TargetControlID="DropDownListIlce" ServiceMethod="GetileGoreIlce" 
            ServicePath="ilIlceSemt.asmx">
        </asp:CascadingDropDown>
        <br />
        <br />
        Semt :
        <asp:DropDownList ID="DropDownListSemt" runat="server">
        </asp:DropDownList>
        <asp:CascadingDropDown ID="DropDownListSemt_CascadingDropDown" runat="server" 
            Category="semt" Enabled="True" LoadingText="semtler yükleniyor..." 
            ParentControlID="DropDownListIlce" PromptText="Lütfen bir semt seçiniz..." 
            TargetControlID="DropDownListSemt" ServiceMethod="GetilceyeGoreSemt" 
            ServicePath="ilIlceSemt.asmx">
        </asp:CascadingDropDown>


Özellikler:



  • TargerControlID - Yerleştirilecek DropDownList kontrolünün ID değerini veriyoruz. Örneğin : DropDownListIl
  • Category - İlgili DropDownList kontrolünün kategori adı. Örneğin : il
  • PromptText - Kullanıcı DropDownList kontrolünden bir değer seçmeden önce gösterilen metin değeridir. Örneğin : Lütfen bir il seçiniz. (Tercihen kullanılabilir)
  • PromptValue - PromptText gösterildiğinde ayarlanan değer. Bu değer kullanıldığında servis metodlarının ona göre belirlenmesi gerekir. Yoksa hata verebilir.(Tercihen kullanılabilir)
  • EmptyText - DropDownList kontrolünün gösterecek verisi olmadığında tercihen kullanılabilecek bir metin değeridir.
  • EmptyValue - EmptyText gösterildiğinde ayarlanan bir değerdir. (Tercihen kullanılabilir)
  • LoadingText - DropDownList kontrolündeki değer yüklenirken gösterilen bir metindir. Örneğin : LoadingText = "iller yükleniyor..."
  • ServicePath - DropDownList kontrolüne yerleştirilmek üzere kullanılan verinin döndürüldüğü web servis metodunun yolu. ServisMethod bir page metot şeklinde tanımlanmışsa bu özellik null olmalı. Web servisin System.Web.Script.Services.ScriptService özelliği dekore edilmeli.
  • ServiceMethod - DropDownList kontrolüne gelen verinin döndürüldüğü servis metodu. Aşağıdaki formata uygun olmalıdır :
[System.Web.Services.WebMethod] 
[System.Web.Script.Services.ScriptMethod] 
public CascadingDropDownNameValue[] GetDropDownContents( string knownCategoryValues, string category) { ... }


Not : Methodun adı farklı olabilir ama dönen tip, parametre adları ve tipleri yukarıdaki formata uygun olmalı. Örneğin GetDropDownContents yerine Getil kullanılabilir.


  • ParentControlID - Bu DropDownList kontrolünü kontrol eden DropDownList kontrolünün ID değeri. Örneğin DropDownLisIl DropDownListIlce kontrolünün parent kontrolüdür ve DropDownListIlce kontrolünün içeriği DropDownList kontrolünden seçilen değere bağlıdır.(Tercihen kullanılabilir)
  • Selected Value - DropDownList kontrolü içerisinde varsayılan olarak seçilmesini istediğimiz değer varsa burada belirleyebiliriz. DropDownList kontrolümüzün içerisindeki değerlerden birisi olmalıdır. 
ilIlceSemt.asmx : 

[WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]
    // To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
    [System.Web.Script.Services.ScriptService]
    public class il : System.Web.Services.WebService
    {
        SqlConnection baglanti = new SqlConnection(WebConfigurationManager.ConnectionStrings["IlIlceSemtConnectionString"].ConnectionString);
        [System.Web.Services.WebMethod]
        [System.Web.Script.Services.ScriptMethod]
        public CascadingDropDownNameValue[] Getil(string knownCategoryValues, string category)
        {
           List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();
           
            baglanti.Open();
            SqlCommand komut = new SqlCommand("select Ad, IlID from iller", baglanti);
            SqlDataReader reader = komut.ExecuteReader();              
            while (reader.Read())
            {
                values.Add(new CascadingDropDownNameValue(reader["Ad"].ToString(), reader["IlID"].ToString()));
                
            }
            
            baglanti.Close();
            return values.ToArray();
        }

        [System.Web.Services.WebMethod]
        [System.Web.Script.Services.ScriptMethod]
        public CascadingDropDownNameValue[] GetileGoreIlce(string knownCategoryValues, string category)
        {
            List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();
            StringDictionary kv = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
            baglanti.Open();
            int IlID = Convert.ToInt32(kv["il"]);
            SqlCommand komut = new SqlCommand("select Ad,IlceID from ilceler where IlID = " + Convert.ToInt16(IlID) + "", baglanti);
            SqlDataReader reader = komut.ExecuteReader();
            while (reader.Read())
            {
                values.Add(new CascadingDropDownNameValue((string)reader["Ad"], reader["IlceID"].ToString()));

            }
            baglanti.Close();
            return values.ToArray();
        }

        [System.Web.Services.WebMethod]
        [System.Web.Script.Services.ScriptMethod]
        public CascadingDropDownNameValue[] GetilceyeGoreSemt(string knownCategoryValues, string category)
        {
            List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();
            StringDictionary kv = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
            baglanti.Open();
            int IlceID;          
            
            if (!kv.ContainsKey("ilce") || !Int32.TryParse(kv["ilce"], out IlceID))
            {
                return null;
            }
            SqlCommand komut = new SqlCommand("select Ad,SemtID from semtler where IlceID = " + IlceID + "", baglanti);
            SqlDataReader reader = komut.ExecuteReader();
            while (reader.Read())
            {               
                    values.Add(new CascadingDropDownNameValue((string)reader["Ad"], reader["SemtID"].ToString()));     

            }
            baglanti.Close();
            return values.ToArray();
        }
    }


contextKey Özelliğinin Kullanımı

     ContextKey alanlarına Eval ile istediğim özellikleri bağlıyorum. 

ContextKey='<%# Eval("sehir") %>' UseContextKey="true" ). 

asmx uzantılı servis dosyamda da string contextKey alanını ekliyorum.

( public CascadingDropDownNameValue[] Getil(string knownCategoryValues, string category, string contextKey) )

values.Add(new CascadingDropDownNameValue(il_ad, reader["il_id"].ToString(),il_ad==contextKey));

   Yukarıda yapmaya çalıştığım şey aslında DetailsView içerisinde CascadingDropDown kullandığımızda güncelleme işlemi yaparken DropDownList kontrolünde daha önceden seçili olan verilerin gösterilmesidir. CascadingDropDown kullanmadan bu işlemi DropDownList kontrolünün SelectedValue özelliğine Bind yaparak gerçekleştirebilirsiniz. contextKey alanına farklı değerler atayarak farklı amaçlar için kullanabilirsiniz.Bu arada aşağıdaki uygulamada bu kısım yok.


İLGİLİ BAĞLANTILAR

  1. Ajax CascadingDropDown Extender- Method Error 500/12031

5 Aralık 2011 Pazartesi

AsyncFileUpload ve FileUpload - Resim Boyutlandırma

   Sunucuya bir resim yüklediğimizde bu resmi bazen küçültmek veya boyutlandırmak isteyebiliriz. Bu konuda pek çok farklı yöntem bulunmaktadır. Bu yöntemlerden birini bugün burada anlatmaya çalışacağım.


using System.Drawing;
using System.Drawing.Drawing2D;
using System.Drawing.Imaging;
using System.IO;


Yukarıdaki namespace alanlarını sayfanızın en üstüne yapıştırınız. Bitmap veya FileInfo gibi sınıflar bu namespace alanları içerinde tanımlanmıştır.


protected void AsyncFileUploadIlan_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
  { 


 AsyncFileUploadIlan.SaveAs(Server.MapPath("~/Resimler/" + AsyncFileUploadIlan.FileName));   // dosyayı geçici olarak ilgili klasöre kaydediyoruz
                    ResimBoyutlandir();         // metodumuzu çağırıyoruz

}






 private void ResimBoyutlandir()
 {
            using (Bitmap OriginalBM = new Bitmap(Server.MapPath("~/Resimler/" + AsyncFileUploadIlan.FileName)))   // geçici olarak kaydettiğimiz resmi getiriyoruz
            {
                Size newSize = new Size(300,300);   // resmin boyutunu ayarlıyorum
                Bitmap Resizebm = new Bitmap(OriginalBM, newSize);  // boyutlandırılmış Bitmap              
                                                                                                              // resmimi oluşturuyorum
                Resizebm.Save(Server.MapPath("~/Resimler/ilan/" +  AsyncFileUploadIlan.FileName));     //  resmi istediğim klasöre kaydediyorum
                OriginalBM.Dispose();
            }
            FileInfo fi = new FileInfo(Server.MapPath("~/Resimler/" + AsyncFileUploadIlan.FileName));   
            fi.Delete();   // geçici olarak kaydettiğim resmi siliyorum
}


   Yukarıdaki metodumuz kullanacağız. Bu metodu kullanmak istediğiniz sınıfın içerisine yapıştırınız. Burada klasör adlarını uygulamanıza göre değiştirmeniz gerekiyor. Ayrıca yazmak istediğiniz klasörlerde de yazma izninin verilmiş olması gerekiyor. Aksi takdirde hata ile karşılaşırsınız.

   Ben burada genişliği : 300 px ve yüksekliği : 300 px olan bir resim boyutu tanımladım. Siz bu boyutu istediğiniz gibi belirleyebilirsiniz. Burada önemli bir nokta var. Peki resmimizin boyutu bu değerlerden küçükse ne olacak ? Sorunun cevabı oldukça basit aslında. Elbette ki bu sefer tam tersi resmin boyutunu büyültecek. Eğer bunun olmasını istemiyorsanız, yani resminizin eni ve boyu belli bir değerden küçükse boyutlandırma yapmadan kaydetmek istiyorsanız yukarıdaki kodlarda biraz değişiklik yapmak gerekiyor:

protected void AsyncFileUploadIlan_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
  { 

 AsyncFileUploadIlan.SaveAs(Server.MapPath("~/Resimler/ilan/" + AsyncFileUploadIlan.FileName));   // dosyayı geçici olarak ilgili klasöre kaydediyoruz
                    ResimBoyutlandir();         // metodumuzu çağırıyoruz

}


  private void ResimBoyutlandir()
   {
  using (Bitmap OriginalBM = new Bitmap(Server.MapPath("~/Resimler/" + AsyncFileUploadIlan.FileName)))
            {
                if (OriginalBM.Width > 300 || OriginalBM.Height > 300)
                {
                    Size newSize = new Size(300, 300);
                    Bitmap Resizebm = new Bitmap(OriginalBM, newSize);


              Resizebm.Save(Server.MapPath("~/Resimler/ilan/" + AsyncFileUploadIlan.FileName));
                    OriginalBM.Dispose();
                }
            }            
 }



Dikkat : Dosyamızı geçici olarak kaydettiğimiz klasör ile kalıcı olarak kaydettiğimiz klasör farklı olmalı yoksa hata mesajı ile karşılaşırsınız.


İLGİLİ BAĞLANTILAR:




1 Aralık 2011 Perşembe

ASP.NET AJAX AsyncFileUpload - Dosyanın Boyutunu Kontrol Etmek

protected void AsyncFileUpload1_UploadedComplete (object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e) 
{
   if (AsyncFileUploadProfilFotografEkle.PostedFile.ContentLength > 1024000)
          Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "Success", "<script                         type='text/javascript'>alert('Dosyanın boyutu en fazla 1 mb olabillir.');</script>");

}

   Bir uygulama tasarlarken belleği etkin kullanmak temel ilkelerden biridir. Sunucumuzdaki alan sınırlıdır. Bu yüzden de bazı dosyaların boyutuna sınırlar getirildiğini internetteki pek çok sitede görebilirsiniz. Burada dosyanın maksimum boyutunu 1mb = 1024000 byte olarak belirledik. Siz bu değeri istediğiniz gibi değiştirebilirsiniz.



İLGİLİ BAĞLANTILAR:


Asp.net Ajax AsyncFileUpload - Yüklenen Dosyayı Silmek

   Bazen yüklediğimiz dosyayı silmek isteyebiliriz. Aşağıda veritabanından silmek istediğimiz dosyanın adını getirip ilgili klasörden nasıl silebileceğimizi görüyoruz. Resim dosyası haricinde diğer dosyalar için de aynı kodları ve mantığı kullanabilmek mümkün. AsyncFileUpload kontrolüyle yeni bir dosya yüklendiğinde de eski dosya varsa silinmesini isteyebiliriz. Bunun için yukarıdaki kodları UploadedComplete yordamının içine eklemeniz yeterli olacaktır. Tabi yeni dosya adını da veritabanına eklemeyi unutmuyoruz.

SqlConncetion   baglanti = new SqlConnection(WebConfigurationManager.ConnectionStrings["GonulluOlmakIstiyorumConnectionString"].ConnectionString);  // Bağlantı cümlesi
   
baglanti.Open();  
            SqlCommand komut = new SqlCommand("select ResimAd from Resim where ResimNo = " + Session["ResimNo"] + "", baglanti);
            SqlDataReader reader = komut.ExecuteReader();
            if (reader.Read())
            {
                string ResimAd = reader["ResimAd"].ToString();
                if (String.IsNullOrEmpty(ResimAd) == false)
                {
                    System.IO.File.Delete(Server.MapPath("~/Resimler/" + ResimAd));
                }
            }
baglanti.Close();

ASP.NET AJAX AsyncFileUpload - Dosyanın Uzantısını Kontrol Etmek

   AsyncFileUpload kontrolü ile dosya yüklerken dosyanın uzantısını kontrol etmek isteyebiliriz. Bunun için farklı yoller denemek mümkün. Aşağıda dosya formatının resim olup olmadığı kontrol ediliyor. Eğer resim formatındaysa kayıt işlemi gerçekleşiyor.

protected void AsyncFileUpload1_UploadedComplete (object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e) 
{
 if (AsyncFileUploadProfilFotografDuzenle.ContentType.Split('/').Contains("image")) 
 { 
     string strPath = MapPath("~/Uploads/") + Path.GetFileName(e.filename);       AsyncFileUpload1.SaveAs(strPath); 
 }
else
{
       Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "Success", "<script   type='text/javascript'>alert('Dosya resim formatında olmalı. (jpeg, jpg, png vs.)');</script>"); 

}