Makale Özeti

3 parçaya bölünmüş bu makalede size alternatif bir AJAX teknolojisi olan, Michael Schwarz tarafından hazırlanmış ve kullanıma sunulmuş, tamamen ücretsiz olan AjaxPro’ dan bahsedeceğim. Öncelikle bu makaleyi hazırlamamda ki temel amaç, İngilizce bilgisi pekiyi olmayan programcılara sade bir dilde bu aracın özelliklerini size anlatmak ve küçük bir örnek ile bunu pekiştirmek.

Makale


Birinci bölümde size nasıl bir yapı olduğundan bahsetmiştim. İkinci bölümde ise örneğimizi adım adım gerçekleştireceğiz.

 

Örneğimiz, kendi web sitemde oluşturduğum yapıdır. (Bkz. www.guyildar.com)

 

İlk olarak Ajax.Pro.2.rar dosyasını indirip (virus taramasından geçirmeniz önerilir), içindeki AjaxPro.2.dll dosyasını projemizde oluşturduğumuz Bin klasörü içerisine kopyalıyoruz.

 

Projemizin web.config dosyasına, config bölümüne AjaxPro nun ashx dosyaları üretmesi için aşağıdaki kodu ekliyoruz.

 

<location path="ajaxpro">

    <system.web>

      <httpHandlers>

        <add verb="*" path="*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/>

      </httpHandlers>

    </system.web>

</location>

 

Daha sonra projemizin içerisine js klasörü (farklı bir adda olabilir) ekleyip. Bu klasör içerisinde yeni bir JavaScript dosyası oluşturuyoruz. Oluşturduğumuz dosyanın adı Ajax.js olsun.

 

Projemizin App_Code klasörüne AjaxClass.vb olarak bir adet vb class dosyası ekleyelim. Tüm server taraflı işlemlerimizi bu class dosyası gerçekleştirecek. Bir namespace oluşturup adını AjaxDeneme verelim.

 

Imports Microsoft.VisualBasic

 

Namespace AjaxDeneme

    Public Class AjaxClass

 

    End Class

End Namespace

 

 

Şekilde de açıkladığım üzere talep ve sonuç üzerine dayalı olduğundan AjaxClass.vb mizin içerisine sonuç verilerinin dönebilmesi için sonuc adında Public Shared bir string eklioruz.

 

Public Shared sonuc As String

 

Veri tabanımızı da hazırlayalım.

 

AjaxDeneme olarak bir database oluşturalım. Bu database içerisinde Kategoriler, Makaleler ve Yorumlar adlarında tablolarımız olsun.

 

Kategoriler tablosunun alanları: K_ID, K_Adi, K_Sira olsun.

 

Makaleler tablosunun alanları: M_ID, G_ID, M_Baslik, M_Icerik, M_Okunma olsun.

 

Yorumlar tablosunun alanları: Y_ID, M_ID, Y_Ekleyen, Y_Email, Y_Yorum, Y_Aktif olsun.

 

(Tablo alanlarının özellikleri adlarından da anlaşıldığından açıklama gereği duymuyorum)

 

Gelelim bu tablolardan nasıl veri alacağız, nasıl ekleme yapacağız, nasıl update işlemi yapacağız ve nasıl onload işlemi uygulayacağız.

 

Gelelim ana sayfamıza,

 

Default.aspx sayfamız da, lblMakaleler, lblIcerik, lblHata, lblEkle, lblYorum olmak üzere 5 adet label, txtAdsoyad, txtEmail, txtYorum olarak 3 adet text box var.

 

lblMakaleler içerisine kategoriler ve makale başlıklarını atacağız. Bizim makale başlıklarımızın bir span tagı içerisinde olması lazım ve bu tagın onlick olayına talebimizi belirten fonksyonu çağırmamız lazım. Bunun için gerekli kodları, ana sayfanın yüklenmesinde gerçekleşecek olaya yazıyorum.

 

Not: Kendi hazırlamış olduğum baglanti adında bir class var ve bu class altında sql bağlantım bulunmakta. Tüm sql bağlantımı buradan gerçekleştiriyorum.

 

Baglanti classı şu şekildedir ve App_code klasörünün altına baglanti.vb olarak kaydedilmiştir.

 

Option Strict Off

Option Explicit On

Imports System.Data.SqlClient

Imports Microsoft.VisualBasic

Public Class baglanti

    Public Con As New SqlConnection

    Public Cmd As New SqlCommand

    Public Rdr As SqlDataReader

 

    Public Sub Bagla()

        Con.ConnectionString = "Server=.;User ID=sa;password=;Database=AjaxDeneme"

        Con.Open()

        Cmd.Connection = Con

    End Sub

    Public Sub Kes()

        Cmd.Dispose()

        Con.Close()

        Con.Dispose()

    End Sub

  

End Class

 

Default.aspx.vb class ının içeriği aşağıdaki gibidir.

 

 

Imports System.Data.SqlClient

Imports System.Data

Partial Class _Default

    Inherits System.Web.UI.Page

    Dim bag As New baglanti

    Dim bag2 As New baglanti

 

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

  Dim bag As New baglanti

        Dim bag2 As New baglanti

        Dim Cmd2 As New SqlCommand

        Dim Cmd As New SqlCommand

        Dim Rdr As SqlDataReader

        Dim Rdr2 As SqlDataReader

 

        bag.Bagla()

        Cmd = bag.Cmd

        Cmd.CommandText = "Select * from Kategoriler order by K_Sira"

        Rdr = Cmd.ExecuteReader

        sonuc = ""

        Dim i = 0

        While Rdr.Read

            bag2.Bagla()

            Cmd2 = bag2.Cmd

            Cmd2.CommandText = "Select * from Makaleler where K_ID = " & Rdr("K_ID").ToString

            Rdr2 = Cmd2.ExecuteReader

            lblMakaleler.text = lblMakaleler.texr & "<br><strong style=""font-size: 12pt"">" & Rdr("K_Adi").ToString & "</strong><br>"

            While Rdr2.Read

                i += 1

                lblMakaleler.text = lblMakaleler.text & "<span id=""" & i & """ onclick=""document.getElementById('lblIcerik').innerHTML = 'Yükleniyor...';SubmitThis('" & Rdr2("M_ID") & "');"" style='cursor:pointer;' title='oku' >" & Rdr2("M_Baslik") & "</span><br>"

            End While

            bag2.Kes()

        End While

        bag.Kes()

    End Sub

 

Burada yaptığımız şey iç içe iki adet while döngüsü oluşturup, önce kategorileri sırayla eklemek sonrasında da o kategoriye ait olan makaleyi altına listeletmek.

 

Makale başlığını bir span içine alıyorum ve tıklanıldığında harekete geçmesi için, onclick olayına ne yapması gerektiğini yazıyorum. İlk tıkladığımız da lblIcerik labelına “Yükleniyor…” yazdırıyorum. (isterseniz buraya <img> tagı ile hareketli bir gif koyabilirsiniz, ya da tüm sayfayı kaplatabilirsiniz, burası size kalmış).

 

Daha sonra ise talebimi Ajax.js dosyasında bulunan SubmitThis fonksyonuna göndermek için makalenin ID sini gönderiyorum.

 

Ajax.js dosyasının içeriğini, AjaxClass.vb dosyasının içeriğini gelecek makalemde bulabilirsiniz.

 

Görüşmek üzere…