Asp.Net Popup Mesaj
Web projeleri yaparken hepimizin aklından şu masaüstü uygulamalarındaki MessageBox keşke web’de de olsa diye geçmiştir. Özellikle benim gibi web projelerinden ve javascript gibi bir can simidinden uzak olanlar. İşte yine böyle düşündüğüm bir gün Burak Hoca’nın paylaştığı A Customize MessageBox, ConfirmBox and FrameBox Control for ASP.NET adlı makaleyi görünce işte aradığım işey dedim. Ancak makaledeki kodları uygularken Ajax Control Toolkit versiyonu yüzünden hata aldım (Makalede kullanılan versiyon 3.0, ben projede 3.5 kullanıyorum.) ve iş başa düştü diyerek bir User Control yazmaya başladım.
Web projeleri yaparken hepimizin aklından şu masaüstü uygulamalarındaki MessageBox keşke web’de de olsa diye geçmiştir. Özellikle benim gibi web projelerinden ve javascript gibi bir can simidinden uzak olanlar. İşte yine böyle düşündüğüm bir gün Burak Hoca’nın paylaştığı A Customize MessageBox, ConfirmBox and FrameBox Control for ASP.NET adlı makaleyi görünce işte aradığım işey dedim. Ancak makaledeki kodları uygularken Ajax Control Toolkit versiyonu yüzünden hata aldım (Makalede kullanılan versiyon 3.0, ben projede 3.5 kullanıyorum.) ve iş başa düştü diyerek bir User Control yazmaya başladım.
DropShadow: Popup pencerede gölgelendirme yapılıp yapılmayacağı.
BackgroundCssClass: Popup pencerenin arkaplan rengi. Burada dikkat edilecek nokta şu ki bu özelliğin bize lightbox tarzı bir kullanım sağlaması.
TargetControlID: Popup pencerenin açılmasını tetikleyecek olan kontrol. Burada popup pencerenin herhangi bir web sayfasında adı bilinen bir butona tıklanmasını amaçlamayıp daha kullanışlı olması açısından bir user control yazıyoruz. Bu nedenle bu user control’ü herhangi bir sayfada kullandığımızda tetikleyecek olan kontrolün adını bilemeyiz. Burada TargetControlID’ yi boş bırakıp user control’ ü sayfaya yerleştirdiğimizde değerini verelim diyemiyoruz çünkü bu durum hata fırlatıyor. Bu nedenle göstermelik olarak bir buton kontrolü koyarak TargetControlID’ ye bu butonun adını veriyor. Bu butonun ekranda görünmesini engellemek için de butona css uyguluyoruz.
Evet kontrol tarafında son aşamaya geldik. Kontrolümüzün kod tarafına geçiyoruz.
Öncelikle kontrolümüzün Başlık, Uyarı mesajı ve Resim Yolu’ nu tutacak özelliklerimizi yazıyoruz.
[Bindable(true), Category(“Custom Property”), DefaultValue(“”)]
public string Text { get; set; }
[Bindable(true), Category(“Custom Property”), DefaultValue(“”)]
public string ImageUrl { get; set; }
[Bindable(true), Category(“Custom Property”), DefaultValue(“”)]
public string Header { get; set; }
PopupMessageBox’ ımızın açılması için kullanacağımız Show() metodunu yazarak içinde ModalPopupExtender’ ın Show() metodunu çağırıyoruz.
public void Show()
{
infoPopup.Show();
}
Sayfadaki Tamam butonu bastığımızda popup’ ın kapanması için butonun Click Event’ inde aşağıdaki kodu yazıyoruz.
protected void btnOk_Click(object sender, EventArgs e)
{
infoPopup.Hide();
}
Son olarak PopupMessageBox’ ımız Render edilmeden önce Başlık bilgisi, Uyarı mesajı ve Resim yolunu ilgili kontrollere Page_PreRender Event’ inde set ediyoruz.
protected void Page_PreRender(object sender, EventArgs e)
{
imgInfo.ImageUrl = ImageUrl;
lblHeader.Text = Header;
lblInfo.Text = Text;
}
Şimdi sırageldi sonucu görmeye. Bunun için web sayfasında öncelikle PopupMessageBox’ ımızı Register ediyoruz.
Sonrasında da aşağıdaki gibi bir buton ve PopupMessageBox’ ımızı tanımlıyoruz.
Son olarak butonun arkasına popup’ ımızı açan kodu yazıyoruz.
protected void btnPopupAc_Click(object sender, EventArgs e)
{
pmBox.Show();
}
Ve sonunda projemizi çalıştırıp sonucu görebiliriz artık.
