ASP.NET te Web Kontrolleri (1-MultiPage)

CorsaiR · 8 Ağu 2007

ASP.NET te Web Kontrolleri (1-MultiPage)

Bu yazıda elimden geldiğince ASP.NET te yeni kontrollerden olan MultiPage, TabSprit, ToolBar ve TreeView nesneleri inceleyeceğimiz bir yazı dizisinin ilk bölümünü anlatmaya çalışacağım.WebControlleri

Bu yazı dizisinde WebControllerini anlatmaya çalışacağım. Bunun için Bilgisayarımıza IEWebControls.msi dosyasını kurmanız gerekiyror.Bu dosya Sistemimize 4 adet yeni nesne ekleyecektir.Bu dosyayı https://tik.lat/EEsVL adresinden indirebilirsiniz. Gerekli olan dosyayı bilgisayarımıza kurduktan sonra. Konumuza başlayabiliriz ilk olarak MultiPage nesnesini anlatacağım.

1-MultiPage

MultiPage nedir?
Hepiniz az yada çok bir üye giriş sayfası görmüşsünüzdür. Kullanıcı bilgileri, Hesap Bilgileri, vs... gibi bir sürü başlıklı bir site düşünün burda ya birden fazla sayfa kullanacaksınız yada panellerle oluşturup tek tek nesnelerimiz panellerin üzerine oluşturacağız. MultiPage bu işlemleri biraz daha kolaylaştırıyor. WebForm üzerine birden fazla panel görmek yerine tekbir panel ile oluşturulan, panelleri kendisi bir index numarasına göre diziyor. MultiPage içinde "<iewc

ageView>" bu tag sayesinde sayfacıklarımız oluşturuyoruz. İlk oluşturduğumuz PageView e " 0 " index numarasını veriliyor ve sonraki oluşturulan "<iewc

ageView>" ile bu index numarası +1 artıyor. Şimdi MultiPage ile ilgili bir örnek yapmaya başlayalım. VS.NET i çalıştırıyoruz. Karşımıza gelen New Project penceresinden uygulama dili olarak C# ı, oluşturulacak proje türü olarak ise ASP.NET WebApplication u seçiyoruz. Daha sonra ******** yazılan yere Projemizin adını IEwebControls olarak belirledikten sonra WebForm1.aspx dosyasının adını MultiPageCs.aspx olarak belirledikten sonra References işlemlerini yapmamaız gerekiyor.(Sekil-1) Bunun için ToolBox penceresine gelip fare ile sağ tıklıyoruz. Costumize toolbox seçeneği ile Nesnelerimiz toolbox a ekliyoruz.

Şimdi MultiPageCs.aspx formumuzun üzerine ToolBoxdan MultiPage nesnemizi fare ile sürükle-bırak yapıyoruz. Şimdi MultiPage nesnemizin properties penceresindeki bazı özelliklerini inceleyim.(tablo-1)

ID MultiPage nesnemizin adını buraya yazıyoruz
SelectIndex Burda default olarak 0 dır multipage de oluşturduğumuz pageview 0 dan başlar burayı eğer 1 verirsen oluşturduğumuz pageview den index numaraı 1 olan sayfa ilk açıldığında gösterilir.
Show Previus Page Önceki Sayfacığa git;
Show Next Page Sonraki Sayfacığa git;

Tablo-1

MultiPageCs.aspx dosyamızın HTML kısmına geçiyoruz. Burda Sayfacık(pageview) oluşturmak için kullancağımız tag "<iewc

ageView></iewc

ageView>" Bu tag ler arasında oluşturduğumuz nesneler örneğin label, textbox, buton vs.. diğer pageview lerde ayrıdır. Her PageView kendi nesnelerinden sorumludur gibide düşünebiliriz.
Örnek bir tag oluşturalım;

<iewc

ageview>
<asp:label id="AdLabel" style="Z-INDEX: 108; LEFT: 15px; POSITION: absolute; TOP: 30px" Runat="server">Ad</asp:label>
<asp:label id="SoyadLabel" style="Z-INDEX: 107; LEFT: 15px; POSITION: absolute; TOP: 70px" Runat="server">Soyadı</asp:label>
<asp:label id="AdresLabel" style="Z-INDEX: 106; LEFT: 15px; POSITION: absolute; TOP: 110px" Runat="server">Adres</asp:label>
<asp:label id="MailLabel" style="Z-INDEX: 105; LEFT: 15px; POSITION: absolute; TOP: 150px" Runat="server">Mail</asp:label>
</iewc

ageview>

Oluşturduğumuzbu tag index numarası ilk olduğu için 0 dır.

Şimdi HTML kısmında yazacağımız kodlar şunlar.(tanlo-2)

<%@ Register TagPrefix="iewc" Namespace="Microsoft.Web.UI.WebControls" Assembly="Microsoft.Web.UI.WebControls, Version=1.0.2.226, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<%@ Page language="c#" Codebehind="MultiPageCs.aspx.cs" AutoEventWireup="false" Inherits="IEWebControls.WebForm1" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm1</title>
<**** content="Microsoft Visual Studio 7.0" name="GENERATOR">
<**** content="C#" name="CODE_LANGUAGE">
<**** content="JavaScript" name="vs_defaultClientScript">
<**** content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">

<iewc:multipage id="MultiPage_Controls" style="Z-INDEX: 101; LEFT: 96px; POSITION: absolute; TOP: 23px" runat="server" BorderStyle="Solid" Width="440px" Height="271px" Font-Names="Verdana" Font-Size="10pt">

<iewc

ageview>

<asp:label id="AdLabel" style="Z-INDEX: 108; LEFT: 15px; POSITION: absolute; TOP: 30px" Runat="server">Ad</asp:label>
<asp:label id="SoyadLabel" style="Z-INDEX: 107; LEFT: 15px; POSITION: absolute; TOP: 70px" Runat="server">Soyadı</asp:label>
<asp:label id="AdresLabel" style="Z-INDEX: 106; LEFT: 15px; POSITION: absolute; TOP: 110px" Runat="server">Adres</asp:label>
<asp:label id="MailLabel" style="Z-INDEX: 105; LEFT: 15px; POSITION: absolute; TOP: 150px" Runat="server">Mail</asp:label>
<asp:textbox id="AdTxt" style="Z-INDEX: 104; LEFT: 110px; POSITION: absolute; TOP: 30px" Runat="server"></asp:textbox>
<asp:textbox id="SoyadTxt" style="Z-INDEX: 103; LEFT: 110px; POSITION: absolute; TOP: 70px" Runat="server"></asp:textbox>
<asp:TextBox ID="AdresTxt" style="Z-INDEX: 102; LEFT: 110px; POSITION: absolute; TOP: 110px" Runat="server" TextMode="MultiLine"></asp:TextBox>
<asp:TextBox ID="MailTxt" style="Z-INDEX: 101; LEFT: 110px; POSITION: absolute; TOP: 150px" Runat="server"></asp:TextBox>

</iewc

ageview>
<iewc

ageview>

<asp:Label ID="KlnAdLabel" style="Z-INDEX: 108; LEFT: 15px; POSITION: absolute; TOP: 30px" Runat="server">Kullanıcı Adı</asp:Label>
<asp:Label ID="SifreLabel" style="Z-INDEX: 107; LEFT: 15px; POSITION: absolute; TOP: 70px" Runat="server">Şifre</asp:Label>
<asp:Label ID="SifreTekrarLabel" style="Z-INDEX: 106; LEFT: 15px; POSITION: absolute; TOP: 110px" Runat="server">Şifre Tekrar</asp:Label>
<asp:TextBox ID="KlnTxt" style="Z-INDEX: 105; LEFT: 110px; POSITION: absolute; TOP: 30px" Runat="server"></asp:TextBox>
<asp:TextBox ID="SifreTxt" style="Z-INDEX: 104; LEFT: 110px; POSITION: absolute; TOP: 70px" Runat="server" TextMode="Password"></asp:TextBox>
<asp:TextBox ID="SifreTekrarTxt" style="Z-INDEX: 103; LEFT: 110px; POSITION: absolute; TOP: 110px" Runat="server" TextMode="Password"></asp:TextBox>

</iewc

ageview>
<iewc

ageview>

<asp:Label ID="SonLabel" style="Z_INDEX: 108; LEFT: 15px; POSITION: absolute; TOP: 30px" Runat="server" Font-Bold="True" Font-Size="14">Uyelik Antlaşması...</asp:Label>
<asp:Label ID="Son1Label" style="Z-INDEX: 107; LEFT: 15px; POSITION: absolute; TOP: 100px" Runat="server" Font-Italic="True" Font-Size="10"> Üyelik metnini okuduysanız kabul etmek için Tamam, Reddetmek için iptal butonuna basınız...</asp:Label>
<br>
<br>
<br>
<asp:Button ID="iptalButon" style="Z-INDEX: 103; LEFT: 110px; POSITION: absolute; TOP: 150px" Runat="server" Font-Bold="True" Font-Size="8" Text="İptal"></asp:Button>
<asp:Button ID="tamamButon" style="Z-INDEX: 102; LEFT: 10px; POSITION: absolute; TOP: 150px" Runat="server" Font-Bold="True" Font-Size="8" Text="Tamam"></asp:Button>

</iewc

ageview>
<iewc

ageview>

<asp:Label ID="IptalLabel" style="Z-INDEX: 102; LEFT: 15px; POSITION: absolute; TOP: 110px" Runat="server" ForeColor="#ff0066" Font-Bold="True" Font-Italic="True">Uyelik anlaşmasını İptal ettiniz iyi günler...</asp:Label>

</iewc

ageview>

</iewc:multipage>
<asp:linkbutton id="sonrakiLinkButon" style="Z-INDEX: 102; LEFT: 444px; POSITION: absolute; TOP: 304px" runat="server" Font-Names="Verdana" Font-Size="9pt">Sonraki >></asp:linkbutton>
<asp:linkbutton id="oncekiLinkButon" style="Z-INDEX: 103; LEFT: 102px; POSITION: absolute; TOP: 304px" runat="server" Font-Names="Verdana" Font-Size="9pt"><< Önceki</asp:linkbutton></form>
</body>
</HTML>

Tablo-2

Buraya kadar yaptığımız işlemler kısaca nesnelerimizi Oluşturduk yani dizayn bölümünü yaptık. (Sekil-2)

Yukarıdaki şekilde görüldüğü gibi 4 adet Sayfacığımız(PageView) var bunlardan ilki Kullanıcı Bilgilerini almak için, ikincisi Üyelik Bilgileri için, üçüncüsü ise Üyelik anlaşması için burda tamam butonuna tıklanınca İlk pageview a dönüyor ve son pageview ise üçüncü pageview da iptal butonuna basılması durumunda yapacağı işlemi gösteriyor.

Şimdi sayfamızın code behing bölümüne geçiyoruz.Burda şuna dikkat etmek gerekiyor. HTML olarak eklediğimiz bir nesnenin olayını mesela bu bir buton olabilir. Bunu Code Behing olarak göremiyoruz bunun için kendimiz bir click eventı tanımlayacağız. Örneğimizin bütün olay yordamları private **** InitializeComponet() metodunda işlem görüyor. Bu metodun içinde tanımladığım click olayına dikkat ediniz.

private **** tamamButon_Click(object sender, System.EventsArgs e)
{
MultiPage_Controls.SelectIndex=0;
}
//*****

private **** iptalButon_Click(object sender, System.EventsArgs e)
{
sonrakiLinkButon.Enabled=false;
oncekiLinkButon.Enabled=false;
MultiPage_Controls.SelectIndex=3;
}

yukarıdaki iki metodu aşağıdaki tablodaki gibi tanımlamamız gerekiyor(Tablo-3)

private **** InitializeComponent()
{
this.sonrakiLinkButon.Click += new System.EventHandler(this.sonrakiLinkButon_Click);
this.oncekiLinkButon.Click += new System.EventHandler(this.oncekiLinkButon_Click);
this.tamamButon.Click += new System.EventHandler(this.tamamButon_Click);
this.iptalButon.Click+=new System.EventHandler(this.iptalButon_Click);
this.Load += new System.EventHandler(this.Page_Load);

Tablo-3

Bu tanımlama işleminden sonra LinkButonlarımızın hareket işlemleri için bir metod yapıyoruz.

private **** hareket(int adim)
{
MultiPage_Controls.SelectedIndex=i+adim;
switch(MultiPage_Controls.SelectedIndex)
{
case 0:
sonrakiLinkButon.Enabled=true;
oncekiLinkButon.Enabled=false;
break;
case 1:
sonrakiLinkButon.Enabled=true;
oncekiLinkButon.Enabled=true;
break;
default:
sonrakiLinkButon.Enabled=false;
oncekiLinkButon.Enabled=true;
break;
}
}

Hareket metodumuzuda oluşturduktan sonra şimdi sonrakiLinkButon nesnemizin click olayına giriyoruz.

private **** sonrakiLinkButon_Click(object sender, System.EventArgs e)
{
hareket(+1); // İleri gitmesi için +1 arttırıyoruz.
}
oncekiLinkButon_Click(object sender, System.EventsArgs e)
{
hareket(-1);// geri gitmesi içim -1 değerni verdik
}

Örneğimiz burada bitmiştir. Şimdi Code Behing daki kodlarım tümünü aşağıdaki tabloda inceleyebilirsiniz
Not: MultiPage için HTML olarak oluşturduğumuz PageView lerimiz içinde tanımlanan textbox, label ve buton gibi nesnelerimizi code behind da da tanımlamamız gerekiyor. Aşağıda Son PageView İçinde kullandığım Buton nesnelerini code behind da da tanımladığıma ve initializecomponet metodundaki

(Tablo-4)

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
usingMicrosoft.Web.UI.WebControls;
namespace IEWebControls
{
///
/// Summary description for WebForm1.
public class WebForm1 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.LinkButton sonrakiLinkButon;
protected System.Web.UI.WebControls.LinkButton oncekiLinkButon;
protected Microsoft.Web.UI.WebControls.MultiPage MultiPage_Controls;
protected System.Web.UI.WebControls.Button tamamButon;
protected System.Web.UI.WebControls.Button iptalButon;
private int i;
private **** Page_Load(object sender, System.EventArgs e)
{
i=MultiPage_Controls.SelectedIndex;
sonrakiLinkButon.Enabled=true;
oncekiLinkButon.Enabled=false;
}
#region Web Form Designer generated code
override protected **** OnInit(EventArgs e)
{
InitializeComponent();
base .OnInit(e);
}
private **** InitializeComponent()
{
this.sonrakiLinkButon.Click += new System.EventHandler(this.sonrakiLinkButon_Click);
this.oncekiLinkButon.Click += new System.EventHandler(this.oncekiLinkButon_Click);
this.tamamButon.Click += new System.EventHandler(this.tamamButon_Click);
this.iptalButon.Click+=new System.EventHandler(this.iptalButon_Click);
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private **** iptalButon_Click(object sender,System.EventArgs e)
{
sonrakiLinkButon.Enabled=false;
oncekiLinkButon.Enabled=false;
MultiPage_Controls.SelectedIndex=3;
}
private **** tamamButon_Click(object sender,System.EventArgs e)
{
MultiPage_Controls.SelectedIndex=0;
}
private **** oncekiLinkButon_Click(object sender, System.EventArgs e)
{
hareket(-1);
}
private **** hareket(int adim)
{
MultiPage_Controls.SelectedIndex=i+adim;
switch(MultiPage_Controls.SelectedIndex)
{
case 0:
sonrakiLinkButon.Enabled=true;
oncekiLinkButon.Enabled=false;
break;
case 1:
sonrakiLinkButon.Enabled=true;
oncekiLinkButon.Enabled=true;
break;
default:
sonrakiLinkButon.Enabled=false;
oncekiLinkButon.Enabled=true;
break;
}
}
private **** sonrakiLinkButon_Click(object sender, System.EventArgs e)
{
hareket(+1);
} //metod
} //class
} //namespace

Tablo-4

Bu yazımda multipage i nasıl kullanılabileceğini anlatmaya çalıştım. Bir sonraki yazımda webcontrollerinden TabSprit nesnesini anlatmaya devam etmeye çalışacağım. Şimdilik bu kadar en kısa zamanda görüşmek üzere. Konu ile ilgili olarak bana mail atabilirsiniz.

ERAY CAKIR

_EReNCaN65 · 4 Eki 2008

Tesekürler ELLERine SaGLik SAoL

ASP.NET te Web Kontrolleri (1-MultiPage)

CorsaiR

Emektar

_EReNCaN65

Adanmış Üye

Sosyal medya sayfalarımız