29/5/2007
Merhaba bir önceki makalede site güncelleme kapsamında login işlemlerini düzenlemeyi incelemiştik. Şimdi Expression Web kullanarak database’den çektiğimiz bilgileri değiştirmeyi inceleyeceğiz.
Başlayalım. Bu serinin 3.makalesinde hazırlamış olduğumuz oneBook.aspx sayfasını açıyoruz.
Bu sayfadaki FormView’un Item Template’ni açacağız. Şu ana kadar sürekli kontrolün küçük okçuğunu kullanmıştık. Şimdi farklı bir yol izleyelim. Kontrolün üstünde sağ klik yapıp menüde Edit Templates>Item Template’i tıklıyoruz.
Item Template alanının en altına Toolbox>ASP.NET Controls>Login altındaki LoginView kontrolünü sürükleyip bırakıyoruz. Ve tasks kutucuğunda LoggedIn Template’i seçiyoruz. Buraya sadece login olunduğunda görünmesini istediğimiz linki koyacağız.
LoginView, LoggedIn Template alanına Toolbox>ASP.NET Controls>Standard altındaki LinkButton kontrolünü sürükleyip bırakıyoruz.
Şimdi bu LinkButton kontrolünün tag properties’ini kullanarak bir kaç düzenleme yapacağız. Görünmesini istediğimiz yazıyı Text alnına yazıyoruz. CommandName ise “Edit” olacak.
İşinizi bitirdiğinizde FormView için “End Template Editing” ile template’yi kapamayı ihmal etmeyin. Expression Web aksi durumlarda son yaptığınız son değişiklikler yokmuş gibi davranabiliyor.
İşlemlerimizi bitirdiğimize göre bir deneme yapalım. Bir kitabın detay sayfasını açtığınızda yaptıklarınızın orada olmadıklarını göreceksiniz.Çünkü siteye login olmadık.
Aynı sayfayı login olduktan sonra açtığımızda ise Kitabı güncelle linkinin geldiğini göreceksiniz.
Kitabı güncelle linkine basınca gelen sayfa altta. Çok güzel gerçekten güncellemeyi yapabilecek miyiz?
Deneyelim. Sayfa sayısını 476’dan 300 düşürüp Update’e basınca alttaki hata sayfasını aldık. Bu çok normal çünkü SQL UPDATE komutlarımızı yazmadık.
Tekrar oneBook.aspx sayfasına dönüyoruz. FormView’un tasks kutusundaki “Configure Data Source”a basıyoruz.
“Define Custom Statements or Stored Procedures”a gelene kadar next ile pencereleri geçiyoruz.
Bu sefer UPDATE tabına tıklayıp alttaki satırları ekliyoruz.
UPDATE [kitap] SET [kitapIsmi] = @kitapIsmi, [kitapYazar] = @kitapYazar, [kitapImage] = @kitapImage WHERE [kitapID] = @kitapID;
UPDATE [kitapDetay] SET [kitapBaskiYili] = @kitapBaskiYili, [yayinEvi]=@yayinEvi, [sayfaSayisi]=@sayfaSayisi, [aciklama]=@aciklama WHERE [kitapDetayID] = @kitapDetayID;
İşlemi bitirince denememizi yapalım. İlk önce login sayfasına açıyoruz ve bağlanıyoruz. Kendimize denemek için bir kitap seçiyoruz.
Kitabı güncelle linkine basıp sayfa sayısını 400 yapıyoruz.
Update’e bastığımızda verimizin güncellendiğini görüyoruz.
Evet şimdi kitaplarımızı güncellediğimiz alanı düzenleyebiliriz. FormView kontrolünün Edit Template’inde EditItem Template’i açıyoruz.
Düzenleme form alanımız alttaki gibi karşımızda. Şimdi bunları daha önce yaptığımız düzenliyoruz.
Açıklamanın textbox’ını tag properties’inde yapacağımız değişikliklerle daha kullanışlı hale getireceğiz. TextMode MultiLine; Height 300px; Width 400px olacak.
Sonuç. End Template diyerek çıkmayı unutmayın.
Evet şimdi browser’da kontrol edelim. Evet gayet güzel çalışıyor. İmaj için söyleyeceğim şu; yeni imajınızı imaj klasörüne koyup adını textbox’a yazarak değiştirmeyi yapabilirsiniz.
Şimdi EditItem Template’teki form elemanlarının kontrolünü yapacağız. Hangi alanın boş bırakılamayacağını bildireceğiz. Bunun için ASP.NET Validation kontrollerini kullanacağız.
EditItem Template alanının üst kısmına Toolbox>ASP.NET Controls>Validation altından Validation Summary kontrolünü sürükleyip bırakıyoruz.
Validation Summary’nin Tag Properties’inde “ShowMessageBox”ı False’dan True’ya çekiyoruz. Böylece kontrol sırasında mesaj kutusunun açılmasını sağlıyoruz.
Kitap satırının altında bir boşlık yaratıp buraya Toolbox>ASP.NET Controls>Validation altındaki RequiredFieldValidator kontrolünü sürükleyip bırakıyoruz.
RequiredFieldValidator’un Tag Properties’inde ControlToValidate ile hangi textbox’ı kontrol edeceğimizi belirliyoruz. Bunun için “kitapIsmiTextBox”ı seçiyoruz.
Yine Tag Properties’de “ErrorMessage” bölümüne kontrol sırasında çıkacak mesajı yazıyoruz.
Yaptığımız kontrol edelim. Siteye login olup, bir kitabı güncelleme sırasında kitap ismi kısmını boş bırakarak Update linkine basarsanız. Alttaki gibi uyarılarla karşılaşırsınız. Üç kere aynı hata mesajını verdirdik.
Biraz önce mesaj kutusunun nasıl getirildiğini öğrenmiştik. Bunun iptal etmek için Expression Web’de sayfamıza dönüp Validation Summary’nin Tag Properties’inde “ShowMessageBox”ı True’dan False’a çekiyoruz. Artık mesaj kutusu açılmayacak.
Peki hem form alanın üstünde hem textbox’ın altında görünen mesaj alan için ne yapacağız. Aslında uzun formlarda her iki alana da hata mesajı verdirmek akıllıca bir çözüm olur ama bizimki gibi küçük bir formda buna ihtiyaç yok. Bunu engellemek için küçük bir hile kullanacağız. RequiredFieldValidator’un Tag Properties’inde Text alanına sadece “*” yazacağız.
Edit alanımızda alttaki gibi görünecek.
Artık bir hata mesajı geldiğinde üstte mesajımız, hatalı alanın altında da onu işaret eden bir “*” işaretimiz var.
Bu makalemde Expression Web ile hazırlamakta olduğumuz dinamik web sitesindeki bilgilerin nasıl güncelleneceğini ve bu bilgi girişlerinin nasıl kontrol edileceğini anlattım.
İyi çalışmalar
Teşekkürler
