17 Şub 2007 DataBound Kontroller ile SQL Paging Kullanımı Kategori: ASP.NET Etiketler: ASP.NET AjaxASP.NET 2.0 1 Yorum Merhaba arkadaşlar bu makalemizde SQL server ile Databound (Gridview, Datalist, Repeater) kontroller ile pagin’in nasıl yapıldığına bakacağız.DataBound Kontroller ile SQL Paging KullanımıSQL Server 2005 ile gelen ROW_NUMBER() fonksiyonu ile SQL Server üzerinde sayfalama yapmak artık çok kolay. ROW_NUMBER() fonksiyonu bize kayıtlarımızın yanında bir satır numarası olusturur ve sayfalamamız ve indexlememiz için bize yardımcı olur. Row_Number() Kullanımı: select top 10 row_number() over (order by name asc) as SatyrNO, ProductID, Name,ProductNumber from Production.Product Gördügümüz gibi bize geriye satır no isimli bir field döndürüyor ve 1 den artarak bize satır numarası olusturuyor. Bu özellikle windows uygulamaları için güzel bir çözüm oldu. Web uygulamarında pagingleme oldukça basitti ama onunda dezavantajları vardı. Özellikle çok fazla kayıt içeren data datagride yüklendiginde tüm veri hem gride yüklenirken oldukça zorlanıyordu hemde sayfalar arasında gezinirken veri tekrar tekrar yükleniyordu. SQL server ile gelen ROW_NUMBER() fonksiyonu ile bize identity gibi artan bir satır numarası döner ve biz bu satır numarası üzerinde istedigimiz degerleri gönderir istedigimiz kadar kaydı görüntüleyebiliriz. Yani grid üzerinde kaç kayıt görüntülemek istersek o kadar kayıt gride yüklenecek. Buda inanılmaz bir performans kazancı olacak.Örnek:select * from (select row_number() over (order by name asc) as SatirNo, ProductID, Name,ProductNumber from Production.Product) Products where (SatirNo between 20 and 30)Gördügümüz gibi bize 20 ve 30 satır numarası arasındaki kayıtlar geri döndü. Artık örnegimize geçebiliriz.Yeni bir web site açalım ve bir grid ekleyelim. Gridimizi ekledikten ve pagin içinde bir label ekleyelim. Grid üzerinde 10 kayıt görüntüleyecegiz ve diger kayıtlara geçmek için olusturacagımız paging ile diger sayfalardaki kayıtlara geçecegiz.Not: Aynı islemi Datalist ve Repeater ile de yapabiliriz. Ben anlasılır olması için Gridview üzerinde yapacagım.Kodumuzu yazmaya baslayalım; ilk olarak connection stringi ayarlayalım. SqlConnection Cnn; SqlCommand Cmd; DataSet Ds; SqlDataAdapter Da; private string CnnStr() // Connection Stringi ayarladık { return "Data Source=*******;initial Catalog=*******;Uid=*******;pwd=*******"; }Connection Stringimizi olusturduk, simdi de Datayı çekecek olacak void'i yazalım. private void DatayiGetir(int Start, int End) // Görüntülenecek datayı çektik.. { Cnn = new SqlConnection(CnnStr()); string sqlstr = "select * from (select row_number() over (order by InsertionDate asc) as SatirNo, InsertionDate, UpdateDate from Messages) Messages where (SatirNo between " + Start + " and " + End + ")"; Da = new SqlDataAdapter(sqlstr, Cnn); Ds = new DataSet(); Da.Fill(Ds, "tbl"); GridView1.DataSource = Ds.Tables[0]; GridView1.DataBind(); }Voidimizi yazdıktan sonra simdi de sayfamızdaki paginglemeyi ayarlayalım. Bunun için öncelikle ihtiyacımız olan Toplam kayıt sayısıdır. Buradan sayfalanacak olan sayfa sayısını bulacagız. private int KayitSayisi() // Sayfalama için Toplam kayıt sayısını aldık. { Cnn = new SqlConnection(CnnStr()); string sqlstr = "select Count(*) from Messages"; if (Cnn.State == ConnectionState.Closed) Cnn.Open(); Cmd = new SqlCommand(sqlstr,Cnn); int recordCount= (int)Cmd.ExecuteScalar(); return recordCount; }Toplam kayıt sayısını aldıktan sonra simdi Sayfa sayısını bulalım ve pagini ekrana basalım.privatevoid PagingiOlustur() { int ToplamSayfaSayisi; StringBuilder sb = new StringBuilder(); if (KayitSayisi() % 10 == 0) { ToplamSayfaSayisi = KayitSayisi() / 10; } else { ToplamSayfaSayisi = KayitSayisi() / 10 + 1; } for (int i = 0; i < ToplamSayfaSayisi; i++) { sb.Append("<a href=SQLPagingAndCustomDataGrid.aspx?Sayfa=" + +(i) + ">" + (i + 1) + "</a>\n"); } Label1.Text = sb.ToString(); }Pagingimizi olusturduktan sonra artık paging isleminin çalısması için Formumuzun loadında Datayı getirecek vodidi ve paging olusturacak voidi çagıralım. private int SayfaNo, Baslangic, Bitis; protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) { if (Request.QueryString["Sayfa"] != null) { SayfaNo = Convert.ToInt32(Request.QueryString["Sayfa"]); } else { SayfaNo = 0; } Baslangic=(SayfaNo *10) + 1; Bitis = Baslangic + 10 -1; PagingiOlustur(); DatayiGetir(Baslangic,Bitis); } }Simdi Projemizi çalıstıralım;Satır numaralarına dikkat ederseniz 1 den 10 a kadar devam ediyor. 2. sayfaya geçelim.Yine satır numaralarına dikkat edersek 10 dan 20 ye kadar yani 2. sayfadaki kayıtları gösteriyor. Gerçekten çok hızlı : )Sizde uyguladıgınızda datanın gridview ile paginglenmesine göre daha performanslı oldugunu göreceksiniz. Bu makalenin de sonuna geldik, baska bir makalede görüsmek üzere basarı ve iyi günler dilerim. Sem GÖKSUMCP | MCAD.NET | MCTS Örnek Kodlar için mail adresimi kullanabilirsiniz askisem@hotmail.com Kaynaklarhttp://msdn.com
16 Şub 2007 Ajax Control Toolkit ile İlgili 3 Yeni Makale Kategori: Benden Etiketler: ASP.NETASP.NET Ajax 0 Yorum Ajaxın yeni nesneleri olan AJAX DragPanel Extender, AJAX UpdatePanelAnimation Extender, AJAX MaskedEdit ve MaskedEditValidator Extender ile ilgili makalelerim www.yazilimuzmani.com ve www.semgoksu.com da yayına girdi.AJAX DragPanel ExtenderAJAX UpdatePanelAnimation Extender AJAX MaskedEdit ve MaskedEditValidator Extender
15 Şub 2007 AJAX DragPanel Extender Kategori: AJAX Etiketler: ASP.NETASP.NET AjaxASP.NET 2.0 0 Yorum Merhaba arkadaşlar, bu makalemizde ajax control toolkit’in nesnelerinden DragPaneel Extender kontrolünü inceleyeceğiz.AJAX DragPanel ExtenderDragPanel Extender WenForm üzerindeki kontrolleri web form üzerinde baska bir yere sürüklenmesini saglar. DragPanel Panel nesnesini hedef alır ve "Drag Handle" gibi kullanmak için kontrole eklenen ek paramatreler alır. Bu kontrolü özellikle web sayfalarımızın reklam bannerlarında kullanırız. Buda sitemize hareketlilik kazandırır. Bende bu makalemde bu nesneniyi reklam banner örnegini kullanarak anlatacagım.Kullanımı:<ajaxToolkit:DragPanelExtender ID="DPE1" runat="server"TargetControlID="Panel3"DragHandleID="Panel4" />Özellikleri: TargetControlID - Tasınacak olan Panel'in ID'si DragHandleID - Tasınacak panel için Tasınacagı panelin ID'si. Kullanıcı paneli bu panelin içerisinde bi yere tasıyabilecek.Örnek:Evet arkadaslar örnegimizde Reklam bannerlerini form üzerinde ordan oraya tasıyacagız : )Ilk olarak bir AJAX projesi açalım. Daha Sonra sayfamıza 2 adet panel ekleyelim ve içerisine reklamını aldıgımız firmanın logosunu koyalım. Ayrıca bir adet de DragPanel Extender nesnesi ekleyelim.Benim yaptıgım form asagıdaki gibidir. Panel için yazdıgım kodlar; <asp:Panel ID="Panel1" runat="server" Direction="LeftToRight" HorizontalAlign="Left" ScrollBars="Horizontal" Width="100%" Height="800px"> <asp:Panel ID="Panel3" runat="server" BorderStyle="Solid" BorderWidth="2px" Width="242px"> <asp:Label ID="Label1" runat="server" Font-Bold="True" Font-Names="Verdana" Font-Size="Small" Text="Kurtlar Vadisi Terör" ForeColor="#C00000"></asp:Label> <br /> <br /> <asp:Image ID="Image1" runat="server" ImageUrl="~/70866.jpg" /><br /> <br /> </asp:Panel> </asp:Panel>Panelimizi yani reklam bannerimizi tasınabilir hale getirelim.<cc1:DragPanelExtender ID="DragPanelExtender11" runat="server" DragHandleID="Panel1" TargetControlID="Panel3" />Simdi projemizi çalıstıralım. Reklam bannerimizi tasıyalım; Evet reklam bannerimizi ordan oraya savurduk : )Bu makalenin de sonuna geldik, baska bir makalede görüsmek üzere basarı ve iyi günler dilerim. Sem GÖKSUMCP | MCAD.NET | MCTS Örnek Kodlar için mail adresimi kullanabilirsiniz askisem@hotmail.comKaynaklar http://ajax.asp.net
15 Şub 2007 AJAX UpdatePanelAnimation Extender Kategori: AJAX Etiketler: ASP.NETASP.NET AjaxASP.NET 2.0 2 Yorum Merhaba arkadaşlar, bu makalemizde ajax control toolkit’in nesnelerinden UpdatePanelAnimation Extenderi ve özelliklerini inceleyeceğiz.AJAX UpdatePanelAnimation ExtenderUpdatepanelanimation sayfalarımıza framework içerisinde tanımlı olan animasyonları uygulamamıza izin veren Ajax kontrolüdür. Bir update islemi tamamlandıgında yada update islemi devam ederken buna baglı olarak animasyonların oynatılmasını saglar.Postback basladıgında OnUpdating animasyonu çalısır fakat Postback sona erdiginde OnUpdated animasyonu çalısır. Not: Update Panelin UpdateMode özelligi always olarak ayarlanmalı çünkü postback tamamlandıgında OnUpdated animasyonu çalısacak. Oynatılan Animasyonlar, XML kullanarak tanımlanır. Frameworkdaki animasyonları kullanmak için; (Using Animation) http://ajax.asp.net/ajaxtoolkit/Walkthrough/UsingAnimations.aspx adresine tıklayınız.Animasyonların propertylerine erismek için(Animasyon Reference);http://ajax.asp.net/ajaxtoolkit/Walkthrough/AnimationReference.aspx Adresine tıklayınız.Kullanımı:<ajaxToolkit:UpdatePanelAnimationExtender ID="ae" runat="server" TargetControlID="up"> <Animations> <OnUpdating> ... </OnUpdating> <OnUpdated> ... </OnUpdated> </Animations></ajaxToolkit:UpdatePanelAnimationExtender>Özellikleri:TargetControlID - Animasyonu oynatmak için kullanılacak olan UpdatePanel'inn ID'si. OnUpdating - Update islemi gerçeklesirken gerçeklesecek olan animasyon. OnUpdated - Update islemi bittiginde gerçeklesecek olan animasyon. Örnek:Örnegimizde SQLDataSource ile Databaseimize baglanıp kayıtlar arasında gezinecegiz. Sayfamız degisirken yada herhangi bir update islemi yapılırken animasyonumuzu oynatacagız. Ilk olarak bir ajax projesi olusturalım.Projemizi olusturduktan sonra Sayfamıza bir adet SQLDataSource ekleyelim. AdventureWorks databaseine baglanım person.contact tablosundaki verileri görüntüleyecegiz. Ben Firstname, MiddleName, LastName ve EmailAddress alanlarını aldım.Daha sonra projemize bir adet Gridview ekleyelim ve DataSourceID özelligini ekledigimiz SQLDataSource1 olarak seçelim. Daha sonra sayfamıza bir adet updatepanel ve updatepanelanimation nesnelerini ekleyelim. Benim tasarladıgım sayfa asagıdaki gibidir.Evet simdi Update Panelimiz postback oldugunda çalısacak olan animasyonumuz için gerekli kodları yazalım.Animasyon 1: <cc1:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender1" runat="server" TargetControlID="UpdatePanel1"> <Animations> <OnUpdated> <FadeOut Duration=".5" Fps="20" /> </OnUpdated> <OnUpdating> <FadeIN Duration=".5" Fps="20" /> </OnUpdating> </Animations> </cc1:UpdatePanelAnimationExtender>Farklı bir animasyon daha verebiliriz. Animasyon 2: <cc1:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender1" runat="server" TargetControlID="UpdatePanel1"> <Animations> <OnUpdated> <Pulse Duration=".5" minimumOpacity=".3" maximumOpacity="2"/> </OnUpdated> </Animations> </cc1:UpdatePanelAnimationExtender>Evet simdi testimizi yapalım.2. sayfaya geçiyoruz ve postback devam ederken sizin için yakaladıgım görüntü asagıdak gibidir.Evet biraz daha donuk bir görüntü ile karsımızda. Sizde denediginizde gerçekten çok güzel bir animasyon efekti oldugunu göreceksiniz J Isterseniz diger animasyonları deneyebilirsiniz. Bu makalenin de sonuna geldik, baska bir makalede görüsmek üzere basarı ve iyi günler dilerim. Sem GÖKSUMCP | MCAD.NET | MCTS Örnek Kodlar için mail adresimi kullanabilirsiniz askisem@hotmail.com Kaynaklarhttp://ajax.asp.net
15 Şub 2007 AJAX MaskedEdit ve MaskedEditValidator Extender Kategori: AJAX Etiketler: ASP.NETASP.NET AjaxASP.NET 2.0 1 Yorum Merhaba arkadaşlar bu makalemde AJAX Control Toolkit nesnelerinden MaskedEdit ve MaskedEditValidator Extender nesnelerini inceleyeceğiz.MaskedEdit:MaskedEdit kontrolü textbox üzerinde giris denetimleri saglayan bir ajax nesnesidir. Bu nesne textboxlara uygulandıgında seçilen veri tipine baglı olarak kullanıcının girecegi deger maskelenir. Girilen verilerin dogrulanması için MaskedEditValidator nesnesini kullanırız. Bu nesneyi nerelerde kullanabiliriz? Bana kalırsa hemen hemen her yerde. Tarih girislerinde, para birimi girislerinde, sadece yazı yada sadece numeric degerleri girmek istedigimiz her yerde bu nesneyi kullanabiliriz. Kullanımı:<ajaxToolkit:MaskedEditExtender TargetControlID="TextBox2" Mask="99,999.99" MessageValidatorTip="true" OnFocusCssClass="MaskedEditFocus" OnInvalidCssClass="MaskedEditError" MaskType="Number" InputDirection="RightToLeft" AcceptNegative="Left" DisplayMoney="Left"/>Maskeleme Karakterleri 9 - Sadece numeric deger L - Harf $ - Harf yada bosluk C - Custom karakter(büyük küçük harf duyarlı) A - Custom karakter yada harf N - Custom karakter yada numeric deger ? - herhangi bir karakter Maskeleme Araçları / - Tarih Ayıracı : - Zaman ayıracı . - Ondalok ayıracı , - Binlik ayıracı DisplayMoney: Para biriminin nasıl gösterilecegini belirler. (sol, sag, none)InputDirection: Veri girisinin baslangıç yönünü belirler.MaskType: Maskeleme tipini belirtir. None - Valdiation yok Number - Numeric validation Date - Tarih validation Time - Zaman validationMessageValidatorTip: Textboxın içerigi degistiginde görüntülenecek mesaj.MaskedEditValidator: Maskelenen textboxdaki verilerin dogrulugunu kontrol etmek için kullanılan kontroldür. Kullanımı:<ajaxToolkit:MaskedEditValidator ControlExtender="MaskedEditExtender2" ControlToValidate="TextBox2" IsValidEmpty="False" MaximumValue="12000" EmptyValueMessage="Number is required" InvalidValueMessage="Number is invalid" MaximumValueMessage="Number > 12.000" MinimumValueMessage="Number < -100" MinimumValue="-100" ValidationGroup="Demo1" Display="Dynamic" TooltipMessage="Input a number: -100 up to 12.000"/>Özellikleri:ControlToValidate - Kontrol edilecek olan textbox'ın ID'siControlExtender - Maskeleme yapan Extenderin ID'siClientValidationFunction - Custom validator içim kullanolan fonksiyonInitialValue - Validation'un baslangıç degeri. Varsayılanı bosturIsValidEmpty - Textbox bossa requiredfield validator'ı çalısır.MaximumValue - Maskeleme için max. Deger. (CompareValidator çalısır)MinimumValue - Maskeleme için min. Deger. (CompareValidator çalısır)MessageEmpty - RequiredValidator çalıstıgında verillecek mesajMaximumValueMessage - Max degerden büyük bir deger girildiginde verilecek mesaj. (CompareValidator çalısır)MinimumValueMessage - Min degerden büyük bir deger girildiginde verilecek mesaj. (CompareValidator çalısır)InvalidValueMessage - Geçersiz deger girildiginde görüntülenecek mesajTooltipMessage - textbox üzerinde gelince yada bosken görüntülenecek olan tooltip degeri.ValidationExpression - Veriyi dogrulamak için kullanılan Regular expression.Örnek: Örnegimizde tarih alanına veri girerek istedigimiz kritere uygun olup olmadıgını kontrol edip verilerin dogrulanmasını, eger girilen veri yanlısssa kullanıcının bilgilendirilmesini saglayacagız. Örnegimize geçelim ve yeni bir Ajax Projesi açalım. Sayfamıza script manager, textbox, MaskedEditExtender, MaskedEditValidationExtender koyalım. Simdi maskleme ve validation için gerekli kodları yazalım. Bunun için HTML kod kısmına geçelim. Maskeleme islemi Validation islemi Projemizi çalıstıralım; ve Geçersiz bir tarih girelim Simdi belirtilen tarihten büyük bir tarih girelim; Simdi belirtilen tarihten küçük bir tarih girelim; Evet gerçekten çok kullanıslı 2 kontrol. Ufak tefek bugları var ama zamanla düzeleceginden hiç kuskum yok :)Bu makalenin de sonuna geldik, baska bir makalede görüsmek üzere basarı ve iyi günler dilerim. Sem GÖKSU MCP | MCAD.NET | MCTS Örnek Kodlar için mail adresimi kullanabilirsiniz askisem@hotmail.com Kaynaklar http://ajax.asp.net