ASP.NET

Merhaba arkadaşlar, bu makalemizde diğer web geliştirme editörlerinde olan ama .net toolbox’da olmayan bir web controlünün nasıl geliştirildiğine bakacağız.

ASP.NET Custom Control Gelistirme - Marquee Kontrolü

Visual Studio da kullanılabilir kontol sayısı çok fazla olsada bazı durumlar da visual studio toolbox'ında yer almayan bir kontrol gerekebilir. Bu durum da geriye 2 seçenek kalır. Ya dısarıdan 3th party bir component satın almalıyız. Yâda kendi kontrolümüzü kendimiz gelistirmeliyiz. Dısarıdan satın almak hem maliyetli bir istir hemde alacagımız kontol bizim isimizi tam olarak görmeyebilir. Ayrıca gelistirmek istedigimizde yine ücret ödememiz gerekebilir. Buda hem biz yazılımcıların hemde firmaların isine gelmez. Bu durumu çözmek için kendi kontrolümüzü kendimiz gelistirebiliriz. Visual studio ile kendi kontrolümüzü gelistirip istedigimiz gibi kullanabiliriz istedigimiz gibi gelistirebiliriz.

Kendi kontrollerimizi gelistirebilmemiz için visual studio WebControlLibrary'yi sundu(Aynı islemleri Class Library ile de yapabiliriz). Simdi ilk olarak WebControlLibrary'de bize lazım olacak metodları tanıyalım.

Render Methodu

Olusturacagımız Custom kontrolü çalıstırdıgımızda tüm islemler render metodunda gerçeklesecektir. Render metodu Web Browser'da kontrolleri görüntülemek için HTML olarak output edecektir. Otomatik olarak sayfayı Host eden sayfayı HtmlTextWriter ile HTML'e çevirecektir. Aynı Clasik ASP de olan Response.write gibi.

Design-Time Destegi

Olusturacagımız nesneye ait özellikleri belirleyecegimiz kısımdır. Kontrol'e design-time özelligi eklemek için property'ler ve class'lar tanımlanır codun içine dahil edilir.

[Category("ÖzellikAdi"),
DefaultValue(""),
Description("Açıklama")]

Attributes

Category
Appearance
Behavior
Data

Description
Belirlenecek olan property ile ilgili açıklama.

DefaultValue
Kendi degerimiz.

Browsable
Property'nin property box içinde gösterilip gösterilmeyecegine karar verir. Alacagı degerler.  true  yada false


Kontrolü kullanmak

Olusturacagımız kontrolü olusturmak için WebControlLibrary'i Build ettikten sonra olusacak olan dll'i kendi toolbox'mızda sag tıklayarak Choose Items seçenegini seçerek ekleyebiliriz.

Örnek: Ben örnek olarak Visual Studio içerisinde yer almayan ama web sayfalarında çok ise yarayan Marquee(kayan yazı) kontrolünü gelistirecegim. Ilk olarak yukarıda da anlattıgım gibi WebControlLibrary olusturalım.



Projemizi olusturduktan sonra Kodumuzu inceleyelim.

namespace CustomControl

{

[DefaultProperty("Text")]

[ToolboxData("<{0}:WebCustomControl1 runat=server>")] // Kontrolümüzün Sayfaya eklendiginde belirlenecek olan ID'si

public class WebCustomControl1 : WebControl

{

[Bindable(true)]

[Category("Appearance")] //propertyleri

[DefaultValue("")]

[Localizable(true)]



public string Text

{

get

{

String s = (String)ViewState["Text"];

return ((s == null) ? String.Empty : s);

}


set

{

ViewState["Text"] = value;

}

}



protected override void RenderContents(HtmlTextWriter output)//Kontrolümüzün output edilecegi render metodu.

{

output.Write(Text);

}

}

}

Simdi projemize devam edelim. Ilk olarak Kontrolümüzün adını SemMarquee yapalım.

namespace Marquee

{

[DefaultProperty("Text")]

[ToolboxData("<{0}:SemMarquee runat=server>")]

public class SemMarquee : WebControl

{

Propertieslerimiz için açıklamayı yapalım.

[Category("Appearance")]

[Browsable(true)]

[Description("Kayan Yazı içerigi")]

[Editor(typeof(System.Web.UI.Design.TextControlDesigner), typeof(System.Drawing.Design.UITypeEditor))]


Simdi property penceremize eklemek istedigimiz özellikleri yazalım


string _text;

string _width;

string _height;



public string MarqueeText //marque içerisinde kaydırılacak olan yazı resim vs..

{

get { return _text; }

set { _text = value; }

}



public string MarqueeWidth //marwuenin genisligi

{

get { return _width; }

set { _width = value; }

}



public string MarqueeHeight //marwuenin yüksekligi

{

get { return _height; }

set { _height = value; }

}

Simdi render edilecek olan marquee'yi yazalım.



protected override void RenderContents(HtmlTextWriter writer)

{

try

{


catch

{

writer.RenderBeginTag(HtmlTextWriterTag.Div);

writer.Write("Kayan Yazı");

writer.RenderEndTag();

}

}



}

}

Evet, Kontrolümüzü olusturduk Simdi bunu bir web site içerisinde kullanalım. Bunun için var olan projemize bir web site ekleyelim.



Simdi ekledigimiz web site'in referanslarına gelip olustugumuz class library'i ekleyelim.



Simdi toolbox'ımıza göz atalım.



Marquee controlümüz toolbox'a eklendi. Simdi bunu formumuza ekleyelim ve özelliklerini belirleyelim.



Simdi projemizi çalıstıralım.



Biraz bekleyelim tekrar bakalım;



Evet çok güzel oldu gerçekten. Artık bizimde bir Custom Web controlümüz var.

Bu makalemizinde de sonuna geldik. Tesekkür eder iyi çalısmalar dilerim.

Sem GÖKSU
MCP | MCAD.NET | MCTS | ASP.NET MVP

Örnek Kodlar için mail adresimi kullanabilirsiniz
semgoksu@semgoksu.com

Kaynaklar

www.codeproject.com

Egerki sunucunuzda ajax kurulu ise hiç bir sorun olmadan AJAX uygulamalarını çalıstırabilirsiniz.

Eger kurulu degilse;

• Ajax tabanlı bir web Projesi açılır.. Ajax tabanlı bir proje degilse web configi düzenleyelelim
• Projenin referanslarına AJAX Extension eklenir..(Microsoft ASP.NET 2.0 AJAX Extensions Toolbox Package)
• System.Web.Extensions.Design.dll ve System.Web.Extensions.dll projeye eklenir...

Bu sekilde sunucu üzerinde ajax kurulu olmasa bile AJAX uygulamarını çalıstırabilirsiniz..

Merhaba arkadaşlar, bu makalemizde ajax control toolkit’in nesnelerinden Ajax SlideShow Nesnesini ve özelliklerini ele alacağız...

Açıklama

Slideshow extender resimleri slayt olarak göstermemize yarayan ajax nesnesidir. Sayfamıza ekleyecegimiz butonlar ile slaytı baslatabilir ve resimler arasında gezinebilirsiniz. Slaytı otomatik baslatabilir ve resimler arasında dönmek için nesnemizi konfigüre edebiliriz. Resimlerimizi göstermek için bir web servisi yada slide show için image destekleyen bir metod kullanabiliriz. Slideshow 3 sn'de bir bir sonraki resmi açar. Eger sona gelmisse yeniden ilk resme döner.

Bu kontol ile aynı windows uygulamalarındaki gibi resimleri slayt seklinde izleyebiliriz. Ayrıca we sayfalarımızda çok daha sık fotogaleriler olusturabiliriz.

Kullanımı


Özellikleri

· SlideShowServiceMethod - AjaxControlToolkit.Slide döndüren bir Web servisi çagırır. Bu web servisi resimlerin pathini ve diger bilgilerini içerir.

Örnek web servisi

[System.Web.Services.WebMethod]

[System.Web.Script.Services.ScriptMethod]

public AjaxControlToolkit.Slide[] GetSlides()

{ ... }

· SlideShowServicePath - Resimler ile ilgili bilgileri döndürecek olan web servisinin adı.

· NextButtonID - Bir sonraki resme geçmek için kullanılacak olan button'un ID'si

· PlayButtonID - Slaytı baslatmak için kullanılacak olan button'un ID'si

· PreviousButtonID - Bir önceki resme geçmek için kullanılacak olan button'un ID'si

· PlayButtonText - Slayt basladıgında baslat butonuna verilecek olan text'in özelligi.

· StopButtonText - Slayt durduruldugunda durdur butonuna verilecek olan text'in özelligi.

· PlayInterval - Slayt için resimler arasındaki geçis süresi.

· ImageDescriptionLabelID - Resimlerin bilgilerini görüntülemek için kullanılacak olan Label'in ID'si

· Loop - Degeri True ise Resimlerin sürekli dönmesini saglayan özellikdie.

· AutoPlay - Degeri True ise Sayfa açıldıgında slayt otomatik olarak çalısır.

Kontrolümüz ile ilgili bilgileri aldıktan sonra bir örnek yapalım. Sizlerden gelen feedback'ler dogrultusunda bu makalede basit bir örnek ile konuyu pekistirecegim.

Örnek: Örnegimizde basit bir image galeri olusturup bu extender'i kullanacagız. Bunun için ilk olarak yeni bir Ajax Web Site olusturalım.



Projemizi olusturduktan sonra sayfamıza sayfamıza 3 adet buton, 1 image, 1 label ve 1 de slideshow extender'i ekleyelim.



Simdi bize resimleri saglayacak olan web servisini yazalım. Bunun için sayfamıza yeni bir web servisi ekleyebiliriz ama ben aynı sayfada static bir servis yazıp onu kullanacagım.

[System.Web.Services.WebMethod]

[System.Web.Script.Services.ScriptMethod]

public static AjaxControlToolkit.Slide[] GetSlides()

{

return new AjaxControlToolkit.Slide[]{

new AjaxControlToolkit.Slide("SlidePictures/1.jpg", "XP Theme 1", "XP Theme 1"),

new AjaxControlToolkit.Slide("SlidePictures/2.jpg", "XP Theme 2", "XP Theme 2"),

new AjaxControlToolkit.Slide("SlidePictures/3.jpg", "XP Theme 3", "XP Theme 3"),

new AjaxControlToolkit.Slide("SlidePictures/4.jpg", "XP Theme 4", "XP Theme 4"),

new AjaxControlToolkit.Slide("SlidePictures/1.jpg", "XP Theme 5", "XP Theme 5")};

}

Olusturdugumuz bu web servis bize Slaytta kullanacagımız resimlerin bilgilerini saglıyor. Simdi Slideshow kontrolünün özelliklerini yazalım.



Simdi bu örnegi test edelim.



Simdi ileri diyelim.



Iste çok isimize yarayacak bir kontrol daha J Bu makalenin de sonuna geldik, baska bir makalede görüsmek üzere basarı ve iyi günler dilerim.

Not: Ajax Sample Site'daki örnekleri incelemeniz size daha farklı fikirler verecektir.

Sem GÖKSU
MCP | MCAD.NET | MCTS | ASP.NET MVP

Örnek Kodlar için mail adresimi kullanabilirsiniz
semgoksu@semgoksu.com

Kaynaklar
http://ajax.asp.net

Merhaba arkadaşlar, bu makalemizde ASP.NET İle SQL Server üzerinde Insert, Update ve Delete işlemleri yapan Stored Procedureleri oluşturup, oluşturduğumuz store procedurleri ASP.NET Projemizde kullanacağız…

Bir önceki makalemizde Bize datayı listeleyen Stored Procedure olusturup bunu ASP.NET içinde kullanmıstık. Bu makalemizde ise Ekleme, Çıkarma ve Güncelleme Stored Proc. Ekleyecek ve bunu asp.net sayfalarında kullanacagız.

Insert: Tablumuza Kayıt ekliyoruz.

Not: Person.Contact Tablosuna kayıt eklemek için Allov null alanları seçili olmayan fieldları seçelim. SP'yi düzgün yazsak bile çalısmayacaktır.

Create Proc InsertPerson
@FirstName varchar(20),
@LastName varchar (20)
as
Insert Into Person.Contact (FirstName,LastName) values (@FirstName, @LastName)

Sp'mizi Test edelim..

InsertPerson 'sem','göksu' // Bakalım Eklemismi ?



Simdi bu islemi ASP.NET tarafında da yapalım.  Olusturmus oldugumuz projeye yeni bir sayfa ekleyelim ve sayfamız üzerine 2 textbox ve 1 button ekleyelim. Button'un Click eventine asagıdaki kodları yazalım;

protected void Button1_Click(object sender, EventArgs e)
{ 
    try 
    { 
        Cnn = new SqlConnection("Data Source=localhost; Initial Catalog=AdventureWorks; trusted_connection=yes"); 
        Cmd = new SqlCommand(); 
        Cmd.CommandType = CommandType.StoredProcedure; 
        Cmd.CommandText = "InsertPerson"; 
        Cmd.Parameters.AddWithValue("@FirstName", TextBox1.Text); 
        Cmd.Parameters.AddWithValue("@LastName", TextBox2.Text); 
        Cmd.Connection = Cnn; 
        if (Cnn.State == ConnectionState.Closed) Cnn.Open(); 
        int result = Cmd.ExecuteNonQuery(); 
        Response.Write(result.ToString() + " Kayıt Eklendi..."); 
    } 
    catch (Exception ex) 
    { 
        Response.Write(ex.Message); 
    }
}



Insert islemimizi tamamladık simdi Update Islemine geçebiliriz.

Update: Varolan bir kaydı güncelliyoruz.

Create Proc UpdatePerson
@ExFirstname varchar(20),
@NewFirstname varchar(20)
as
Update Person.Contact Set FirstName = @NewFirstname
where FirstName=@ExFirstname

Test edelim;

UpdatePerson 'Crystal','Penguen'

(22 row(s) affected) > 22 tane Firstname'i Crystal olan kayıt person ile degistirildi.

Simdi Asp.net tarafını yazalım;

Yeni Bir sayfa ekleyelim ve sayfamıza 2 textbox ve 1 button girelim. 1. textbox'a güncellenecek olan Firstname'i ve 2.textbox'ada yeni degeri girecegiz. Buton ile de islemi gerçeklestirecegiz. Button'un click eventine asagıdaki kodları yazalım;

protected void Button1_Click(object sender, EventArgs e)
{ 
    try 
    { 
        Cnn = new SqlConnection("Data Source=localhost; Initial Catalog=AdventureWorks; trusted_connection=yes"); 
        Cmd = new SqlCommand(); 
        Cmd.CommandType = CommandType.StoredProcedure; 
        Cmd.CommandText = "UpdatePerson"; 
        Cmd.Parameters.AddWithValue("@ExFirstname", TextBox1.Text); 
        Cmd.Parameters.AddWithValue("@NewFirstname", TextBox2.Text); 
        Cmd.Connection = Cnn; 
        if (Cnn.State == ConnectionState.Closed) Cnn.Open(); 
        int result = Cmd.ExecuteNonQuery(); 
        Response.Write(result.ToString() + " Kayıt güncellendi..."); 
    } 
    catch (Exception ex) 
    { 
        Response.Write(ex.Message); 
    } 
}

Hemen test edelim;



Sp'yi test ederken Firstname'i Crystal olan kayıtları penguen ile degistirmistim. Simdi yeniden eski degeri ile update etmis oldum. 22 adet kaydın güncellendigini görüyoruz.

Delete: Tablomuzdan kayıt siliyoruz. Stored Proc. Olusturalım.

Not: Eger Sizde benim kullandıgım gibi Person.Contact tablosunu kullanacaksanız tablo Üzerindeki Foreign keyleri kaldırın. Yoksa kayıtları silemeyeceksiniz.

create proc DeletePerson
@Firstname varchar(20)
as
Delete from Person.Contact  where FirstName = @Firstname

SP'yi test edelim.

DeletePerson 'Gustavo'

(2 row(s) affected) > Gustavo adın da 2 kaydı sildi..

Simdi son olarak da bunun asp.net tarafını yapalım.  Yeni bir sayfa ekleyelim ve sayfamıza 1 textbox ve 1 button ekleyelim. Daha sonra butonun click eventine asagıdaki kodları yazalım;

protected void Button1_Click(object sender, EventArgs e)
{ 
    try 
    { 
        Cnn = new SqlConnection("Data Source=localhost; Initial Catalog=AdventureWorks; trusted_connection=yes"); 
        Cmd = new SqlCommand(); 
        Cmd.CommandType = CommandType.StoredProcedure; 
        Cmd.CommandText = "DeletePerson"; 
        Cmd.Parameters.AddWithValue("@Firstname", TextBox1.Text); 
        Cmd.Connection = Cnn; 
        if (Cnn.State == ConnectionState.Closed) Cnn.Open(); 
        int result = Cmd.ExecuteNonQuery(); 
        Response.Write(result.ToString() + " Kayıt silindi..."); 
    } 
    catch (Exception ex) 
    { 
        Response.Write(ex.Message); 
    }
}

Testimizi yapalım;



Firstname'i "Sem" olan 5 kayıt vardı ve biz bunu stored procedurumuzü çalıstırarak sildik.. 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
semgoksu@semgoksu.com

Kaynaklar
http://msdn.com

Merhaba arkadaşlar, bu makalemizde ASP.NET İle SQL Server üzerinde Stored Procedure oluşturup, oluşturduğumuz stored procedurü ASP.NET Projemizde kullanacağız…

Stored Procedure Nedir?

Ilk olarak kısaca Stored Procedürden bahsedeyim;

Stored Procedures SQL Server üzerinde tutulan T-SQL ifadeleridir. Belli bir görevi yerine getirebilmek amacıyla yapılandırılırlar. SQL Server üzerinde derlenirler. Belirledigimiz sartlara göre, program içinden çagrılarak kullanılırlar.  T-SQL deyimleriyle yazılan Store Procedures sadece ilk kez çalıstırıldıklarında derlenirler. Daha sonraki çalıstırma islemlerinde derlenmezler. Bu sayede çalısmalarımızda hız kazanmıs oluruz. Stored Procedürlerin bir baska artısı da çok güvenlidir.

Örnek
Create Proc LastTenPerson
as
select top 10 ContactID, FirstName, LastName from Person.Contact order by ContactID desc

Bu Stored procedurü çalıstıralım;

exec LastTenPerson > bize geri dönen sonuç;



Bize son 10 kaydı geri döndürdü.

Simdi isterseniz bu olusturdugumuz Stored Procedurü, ASP.NET Projesinde kullanalım;  lk olarak bir web projesi açalım;



Projemizi olusturduktan sonra sayfamıza bir adet grid ekleyelim;



Evet simdi kaydımızı görüntüleyecek olan kodları yazalım ilk olarak System.Data ve System.Data.SqlClient namespacelerini sayfamıza ekleyelim.

using System.Data;
using System.Data.SqlClient;

Daha sonra sayfamızda kullanacagımız degiskenleri tanımlayalım;

SqlConnection Cnn;
SqlCommand Cmd;
SqlDataAdapter Da;
DataSet Ds;

Simdi Kaydımızı listeleyecek olan voidi yazalım(Isterseniz function olarak yada class içerisinde kullanabilirsiniz).

private void GetLastTenPerson()
{ 
    Cnn = new SqlConnection("Data Source=localhost; Initial Catalog=AdventureWorks; trusted_connection=yes");//DB Baglantısı 
    Cmd = new SqlCommand(); 
    Cmd.CommandType = CommandType.StoredProcedure;//Command Tipi 
    Cmd.CommandText = "LastTenPerson";//SP Adı 
    Cmd.Connection = Cnn;//Commandin kullanacagı Connection 
    if (Cnn.State == ConnectionState.Closed) Cnn.Open(); 
    Da = new SqlDataAdapter(Cmd); 
    Ds = new DataSet(); 
    Da.Fill(Ds,"table"); 
    GridView1.DataSource = Ds.Tables[0]; 
    GridView1.DataBind();
}

En son olarak bunu Formun Load'da çagıralım;

protected void Page_Load(object sender, EventArgs e)
{ 
    GetLastTenPerson();
}

Simdi Projemizi çalıstıralım;



Son 10 kaydımızı basarı ile listeledik; Simdi Stored Proceduremizi biraz daha genisletelim ve Bir kriter ekleyelim. Örnegin Firstname'ni biz dısarıdan girelim ve girdigimiz Firstname'e göre kayıtlar listelensin. Bunun için Stored Procedure içerisine dısarıdan bir parametre almalıyız. Biz buna input parametre diyoruz.

Stored Proceduremizin düzenlenmis hali;

Alter Proc LastTenPerson //SP'mizi Alter ettik
@FirstName varchar(20)//Input Parameter
as
select top 10 ContactID, FirstName, LastName from Person.Contact
where FirstName=@FirstName
order by ContactID desc


exec LastTenPerson 'Crystal'

Sonucu görelim;



Firstname'i sadece Crystal olanlar geldi; Simdi bunu ASP.NET tarafında da yapalım;  Bunun için projemize bir adet buton ve bir adet textbox ekleyelim. Sayfamızdaki kodları Command out yapalım yada silelim çünkü SP degistigi için çalıstıgında hata verecektir. Button1'e tıklayalım;

protected void Button1_Click(object sender, EventArgs e)
{ 
    Cnn = new SqlConnection("Data Source=localhost; Initial Catalog=AdventureWorks; trusted_connection=yes"); 
    Cmd = new SqlCommand(); 
    Cmd.CommandType = CommandType.StoredProcedure; 
    Cmd.CommandText = "LastTenPerson"; 
    Cmd.Parameters.AddWithValue("@Firstname", TextBox1.Text);// Dısarıdan Store Procedure parametre ekliyoruz.. 
    Cmd.Connection = Cnn; 
    if (Cnn.State == ConnectionState.Closed) Cnn.Open(); 
    Da = new SqlDataAdapter(Cmd); 
    Ds = new DataSet(); 
    Da.Fill(Ds, "table"); 
    GridView1.DataSource = Ds.Tables[0]; 
    GridView1.DataBind();
}

Simdi projemizi tekrar çalıstıralım ve sonucu görelim.



Yukarıda da görüldügü gibi Firstname'i sadece 'Crystal' olan kayıtlar listelenmektedir.  Bu makalenin de sonuna geldik, bir sonraki makale de Insert, Update ve Delete islemlerini inceleyecegiz. 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
semgoksu@semgoksu.com

Kaynaklar
http://msdn.com